「CSS3 PIE」でIE6・IE7・IE8をCSS3に対応

「CSS3 PIE」でIE6・IE7・IE8をCSS3に対応

IE6・IE7・IE8で、角丸・ボックスシャドウ・グラデーション・マルチバックグランドなどが利用可能になる「CSS3 PIE」を試しました。

「CSS3 PIE」では以下のプロパティがサポートされてます。

  • border-radius
  • box-shadow
  • border-image
  • multiple background images
  • linear-gradient as background image

ダウンロード

こちらからスクリプトをダウンロード。

ダウンロード

設置

ファイルを解凍して「PIE.htc」をサーバーにアップ。

使い方

CSSにbehaviorプロパティを使い読み込みます。

behavior: url(/PIE.htc);

角丸だとこんな感じ。

.sample {
border-radius: 5px;
behavior: url(/PIE.htc);
}

「PIE.htc」の場所は絶対パスか相対パスで指定します。相対パスで指定する場合はCSSから「PIE.htc」への相対パスではなく、「PIE.htc」を使用しているHTMLから「PIE.htc」への相対パスを指定する必要があります。

「PIE.htc」が適用されない場合は「position: relative」もしくは「position: relative」と「z-index」を指定するといいみたいです。

参考サイト

下のボタンを押すと拍手送信&メッセージフォームが開きます。→WEB拍手お返事