IEにCSS 3フィレットをサポートさせる方法
IE 6/7/8の3つのIEブラウザバージョンはCSS 3の解析をサポートしていないが、まだ主流ではないIE 9だけがCSS 3とHTML 5の標準をサポートしている.IEにCSS 3をサポートさせる解析方法はいろいろありますが、以下では実用的なIEにCSS 3解析をサポートさせる方法を紹介します.IEはVMLベクトルマーク可能言語をブラシとしてフィレットを描きます.
1、圧縮パッケージをダウンロードし、マイクロソフトのスクリプトファイル(11 KB)とサーバーに正しいContent-TypeがあるかどうかをテストするHTMLファイル:iecss 3.rar;.htcファイルは、IEカーネルがWeb動作をサポートした後、このような動作を記述するためのスクリプトファイルです.これらは一連の方法と属性を定義し、プログラマーはこれらの方法と属性をHTMLページの任意の要素にほとんど適用することができます.Webの動作は、プログラマが既存の要素やコントロールにカスタム機能を「接続」できるようにするため、ActiveXコントロールなどのバイナリファイルをダウンロードしてこの機能を完了させる必要はありません.
ダウンロード先:http://www.iefans.net/wp-content/uploads/2010/12/iecss3.rar
解凍してtestを開きます.html、表示効果がフィレットの場合は続行できます.
プレゼンテーションの使用方法:
.main{ border: 2px solid #C0C0C0; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; position:relative; z-index:2; behavior:url(ここではie-css 3.htcファイルの絶対パス). }
Webkitカーネルのブラウザは「-webkit-border-radius:10 px;」をサポートしています.アトリビュート(10 pxはフィレット半径)で、フィレットを直接解析できます.Firefoxブラウザは「-moz-border-radius:10 px;」をサポートしています.プロパティは、フィレットを直接解析することもできます.IE系ブラウザには「border-radius:15 px;で行ないます.
注意:
1、behaviorのurlには必ずie-css 3を記入してください.htcの絶対パスは、IEブラウザがそのファイルを探すのは現在のhtmlファイルのパスに対して探しているので、Wordpressなどのダイナミックプログラムで生成されたページには絶対パスを記入しなければなりません.
2、必ず位置決め属性:position:relative;
3、IEブラウザの下でこれらのCSS 3効果の実現はVMLを借りて、VMLによってフィレットまたは投影効果を描くため、z-index属性も必要である.z-indexプロパティは2のように大きく設定することが望ましい.
4、IEブラウザの下で一部のモジュールがこのレンダリングを使用できない場合は、対応するレイヤを絶対的に位置決めしてみてください.すなわち、「width:400 px;height:400 px;height:400 px;で行ないます.
5、radius属性の10 pxはフィレット半径であり、「border-radius:10 px 5 px;」のような2つの値を与えることもできます.これにより、左上角と右下角の半径は10 px、右上角と左下角の半径は5 pxとなる.「上右下左」の4つの値を割り当てることもできます.
1、圧縮パッケージをダウンロードし、マイクロソフトのスクリプトファイル(11 KB)とサーバーに正しいContent-TypeがあるかどうかをテストするHTMLファイル:iecss 3.rar;.htcファイルは、IEカーネルがWeb動作をサポートした後、このような動作を記述するためのスクリプトファイルです.これらは一連の方法と属性を定義し、プログラマーはこれらの方法と属性をHTMLページの任意の要素にほとんど適用することができます.Webの動作は、プログラマが既存の要素やコントロールにカスタム機能を「接続」できるようにするため、ActiveXコントロールなどのバイナリファイルをダウンロードしてこの機能を完了させる必要はありません.
ダウンロード先:http://www.iefans.net/wp-content/uploads/2010/12/iecss3.rar
解凍してtestを開きます.html、表示効果がフィレットの場合は続行できます.
プレゼンテーションの使用方法:
Webkitカーネルのブラウザは「-webkit-border-radius:10 px;」をサポートしています.アトリビュート(10 pxはフィレット半径)で、フィレットを直接解析できます.Firefoxブラウザは「-moz-border-radius:10 px;」をサポートしています.プロパティは、フィレットを直接解析することもできます.IE系ブラウザには「border-radius:15 px;で行ないます.
注意:
1、behaviorのurlには必ずie-css 3を記入してください.htcの絶対パスは、IEブラウザがそのファイルを探すのは現在のhtmlファイルのパスに対して探しているので、Wordpressなどのダイナミックプログラムで生成されたページには絶対パスを記入しなければなりません.
2、必ず位置決め属性:position:relative;
3、IEブラウザの下でこれらのCSS 3効果の実現はVMLを借りて、VMLによってフィレットまたは投影効果を描くため、z-index属性も必要である.z-indexプロパティは2のように大きく設定することが望ましい.
4、IEブラウザの下で一部のモジュールがこのレンダリングを使用できない場合は、対応するレイヤを絶対的に位置決めしてみてください.すなわち、「width:400 px;height:400 px;height:400 px;で行ないます.
5、radius属性の10 pxはフィレット半径であり、「border-radius:10 px 5 px;」のような2つの値を与えることもできます.これにより、左上角と右下角の半径は10 px、右上角と左下角の半径は5 pxとなる.「上右下左」の4つの値を割り当てることもできます.