VMLメモ

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リリース出来たらよいですね。

スポンサードリンク

に関するエントリー

トラックバック(0)