Internet Explorer 6、7、8でCSS3機能を有効にする方法


18

IE9は非常に有望に見えますが、IE6、IE7、およびIE8はおそらく今後何年も私たちを悩ませ、Web上のCSS3の普及を遅らせるでしょう。

HTCとJSに基づく多くのプロジェクトがIEにCSS3サポートを追加しています:

  • CSS3PIE
  • IE7.js
  • eCSStender
  • DD_roundies
  • border-radius.htc(曲線コーナー)
  • ie-css3.htc
  • ie-css3.js

私はCSS3PIEの経験しかありません(http://docs.composite.net/で丸みを帯びたものを行います、マウスオーバー効果を除いてこれはうまく機能し、純粋なCSS3です。

さまざまなプロジェクトがIEにもたらすCSS3機能とその効果 それらのいずれかが明確な勝者ですか?


1
それらをすべて試してみて、見つけたものをお知らせください。あなたがブログを持っているなら、それは私が確信している多くの関心を生成する素晴らしい投稿になるでしょう。
ジョンコンデ

CSS3PIEサイトcss3pie.com/documentation/product-comparisonでこれを見つけましたが、偏っていると思われるので、質問です。いい感じを得るには、少し現実的な経験が必要です。
mawtex

回答:


8

まだ誰もステップアップしていないので、私はこれに答えようとします。これは主にhttp://css3pie.com/documentation/product-comparison/を読んで集めたものです。を、あちこち探し回ってです。私はCSS3PIEの実践的な経験しかありません。他のプロジェクトのいずれかを知っている場合は、これを自由に編集してください

CSS3PIE CSS3ボーダー半径のためのジェイソン・ジョンストン追加良いサポートすることにより、グラデーション、ボックスシャドウ。これに関する私の経験は、それがかなりうまく機能し、境界半径を大きくサポートしていることです。ホバー効果には問題があります(このリストのすべての項目がこの問題に悩まされると思います)が、静的htmlで使用すると問題がないように見えます。詳細については、http://css3pie.com/

Keith Clarkのie-css3.js多くのCSS3擬似クラスセレクターのサポートを追加します。jQueryのような他のjsライブラリを使用するため、非常に小さいです。これは、CSS3PIEのようなこのリストの他のプロジェクトでうまく機能する可能性があります。詳細情報http://www.keithclark.co.uk/labs/ie-css3/
UPDATE:IE-css.jsプロジェクトがここに生まれ変わってきましたhttp://selectivizr.com/

IE6、7、8向けのDean Edwards WorksによるIE9.js。IEが透過PNGをサポートし、parent> childや:first-of-typeなどの新しいCSSセレクター、固定位置、最大/最小幅/高さサポートをサポートします。長年にわたって多くの仕事がこれに費やされてきたという印象です。一部のレビューは本当に肯定的で、一部は否定的です。詳細については、http://code.google.com/p/ie7-js/をご覧ください

アーロン・グスタフソンによるecsstenderはIE6、7、8で動作します。モジュラー方式では、CSS3セレクター、フォントフェース、ボーダー半径、ボックスシャドウ、カラー、トランスフォームのサポートが追加されます。非常によく文書化されています。詳細については、http://ecsstender.org/extensionsをご覧ください

Drew DillerのDD_roundies border-radiusとpngのサポートを追加します。詳細については、http://www.dillerdesign.com/experiment/DD_roundies/

Remiz Rahnasによるborder-radius.htc border-radiusの非常にシンプルなサポート。詳細については、http://code.google.com/p/curved-corner/をご覧ください

Nick Fetchakによるie-css3.htc border-radiusおよびtext-shadowのサポート。CSS3PIEは、border-radiusの方が優れていると主張しています。詳細はhttp://www.fetchak.com/ie-css3/をご覧ください


3

Smashing MagazineのCSS3およびIE6に関する素晴らしい記事を次に示します。http : //www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/


3
この記事は「border-radius.htc」の優れた入門書ですが、ほとんどの場合、CSS3機能を模倣できるIE専用のCSSフィルターのリストです。Web開発者として、私は古いIE固有のCSSコードをあまり書きたくないが、標準CSSに焦点を合わせ、IEに「border-radius.htc」や「CSS3PIE」のように反応させたい。
mawtex

0

Google Chrome Frameをお試しください。IEをインストールしたIEユーザーは、ブラウザを切り替えることなく、Google Chromeのレンダラーでサイトを閲覧できます。

編集:Googleが提供するJSライブラリを使用して、ユーザーにGoogle Chrome Frameのインストールを招待するメッセージを表示することもできます。Flashのようなワンクリックインストールで、ブラウザを再起動する必要はなく、完了したらページを更新します。


あなたの提案は、基本的にIE6 / 7/8で将来的に質問ポスターのサイトを訪問するすべての人々に手を差し伸べ、彼らが訪問する前にGoogle Chrome Frameをインストールするようにすることです?代わりに世界中のすべてのIEユーザーをChromeに切り替える方が簡単だと思いませんか?
ニール

@Nir編集して、ユーザーにGoogleのJSライブラリを使用してGCFをインストールする方法を説明しました。とてもいいです。
ダンファブリチ

ワンクリックインストールでも(ところで、Vistaでは、Flashをインストールするために5つのセキュリティ警告が必要です-ワンクリックで非常に)丸い角を使用できるようにブラウザプラグインをインストールするようにユーザーに求めるのは夢ではありません(そして私がインストールするのは、本当に私の製品を信頼し、気に入っている人だけです。つまり、丸い角がなくても購入する人です。
ニル
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.