SVGのお父さんみたいな奴。IEでのみ利用可能。alphafilter v2の為、色々調査中。
名前空間の設定
html要素にて名前空間を設定
<html xmlns:v="urn:schemas-microsoft-com:vml">
vの箇所は任意の文字列、移行vとして記述。
スタイルの定義
以下のCSSを設定
v\:* {
behavior: url(#default#VML);
}
ただし、標準準拠モードの場合は以下の指定も必要。(imageあたりが表示されない)
v\:* {
behavior: url(#default#VML);
display:inline-block
}
さらに、IE8からは以下の指定に変更
v\:line, v\:rect, v\:roundrect, v\:oval {
behavior: url(#default#VML);
display:inline-block
}
*(ユニバーサルセレクタ)による全指定が出来なくなったので利用するVML要素で個別に指定
後は本文中にVML要素を記述すればよし。
rect
<v:rect style="width:30; height:30;"
fillcolor="#ffcccc" strokecolor="red" strokeweight="1" />
四角を書く。
ボーダーを消すには
<v:rect style="width:30; height:30;>
<stroke opacity="0";>
</v:rect>
1pxの透明なボーダーが存在するけどそこらへんは上手にごまかす。
背景を書くには
<v:rect style="width:30; height:30;>
<fill type="tile" src="hoge.jpg";>
</v:rect>
0.数pxで微妙にずれる。
今週中にはalphafilter v2リリース出来たらよいですね。
スポンサードリンク
HTML OR 技術系に関するエントリー
メールで購読する
twitterで購読する
RSSで購読する
コメントする