IE6～8でCSS3の一部に対応「CSS3PIE」
IE6～8ではCSS3のプロパティにほとんど対応していませんが、
ライブラリ等を使えば幾つかのプロパティは使用することができます。
今回はCSS3PIEというjavascript (.htcファイル)についてご紹介。
- border-radius(角丸)
- box-shadow(ボックスに影)
- border-image(ボーダーに画像を使用)
- multiple background images(背景画像の複数指定)
- linear-gradient as background image(グラデーション)
がIE6～8でも使えるようになります。
使い方はまずサイトよりZipファイルをダウンロードし、
解凍後にできたフォルダからPIE.htcというファイルをアップロードします。
CSSの記述は下記のように、
.item_01 {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url("/PIE.htc");
}
上記コードのように、最後にbehavior: url(“/PIE.htc”);というように、
behaviorプロパティでファイルの位置を指定します。
URLの指定は通常のようにCSSファイルからの相対パスではなく、
使用しているHTMLファイル側からのパスを記述します。
詳細な使い方については、All Aboutさんの
IE6～8でも一部のCSS3が使える！「CSS3 PIE」の使い方
が参考になるかと思います。
また最近（2012年5月22時点）になり、新しいバージョンがリリースされたそうです。
