IE6など古いバージョンのInternet ExplorerにCSS3を適用させる方法で、以前「IE-CSS3」をご紹介したのですが、「PIE.htc」の方が対応しているプロパティも多く、また動作が安定していて良さそうな印象を持ちました。
角丸、ボックスシャドウ、グラデーション、マルチバックグランドなどが利用可能になります。
以下、覚え書きです。
■手順1
まずHTCファイルをダウンロードします。
PIE download
■手順2
ダウンロードしたファイルを好きな場所に配置します。
■手順3
CSSの最後にbehaviorプロパティを使い読み込みます。
behavior: url(PIE.htc);
▼5pxの角丸ボックスを作成する場合のCSS記述例
[css]
.sample {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
behavior: url(PIE.htc);
}
[/css]
.-moz-border-radiousはfirefox用の記述、-webkit-border-radiusはsafariとchrome用の記述です。また「PIE.htc」でサポートしているプロパティは下記になります。
・border-radius
・box-shadow
・border-image
・multiple background images
・linear-gradient as background image