Internet Explorer 8のCSS3対応まとめ

Webマーケティングで
規模ではなく戦い方で勝つ会社を増やす

『売上か集客か採用か』
いちばん変えたいことから逆算する『ゴールファースト設計』。
名古屋で700社以上を支援してきたWeb制作会社です。

Webマーケティングで
規模ではなく
戦い方で勝つ会社を増やす

『売上か集客か採用か』
いちばん変えたいことから逆算する『ゴールファースト設計』。
名古屋で700社以上を支援してきたWeb制作会社です。

ブログBLOG

2014/10/05プログラミングHTML

こんにちわ花岡です。
めっきり寒くなったと思ったら秋分が過ぎていました。今年も残る所3ヶ月です。

今回は対応が減ることのないInternet Explorer 8のCSS3対応状況についてです。

マイクロソフトのWindows OS向けWebブラウザー。略称：IE8。
欧州版を除くWindows 7に標準で搭載されている。

IE7と比べパフォーマンスが改善されているほか、このバージョンからカタカナ表記に若干変更が見られるようになった（例：ブラウザ→ブラウザー）。
なお、次のIE9からWindows XPに非対応となったので、Windows XPに対応する最後のInternet Explorerとなった。

はてなキーワード

XP対応が減ったためIE8も切り捨てたいのですが、Windows7では標準で入っているので捨てるに捨てれません。
IE9はCSS3などに対応している点も多いので、コーダーにとっては随分と楽になったはずです。
一方でIE8は2009年生まれという事もありCSS3の対応は厳し目、やはりIEシリーズはWeb制作者の嫌われ者です。

IE8で使えないCSS

背景関連	background: bkg1、 bkg2（複数の背景を使える） background-clip background-size
擬似クラス	:nth-child :nth-last-child :nth-of-type :nth-last-of-type :last-child :first-of-type :last-of-type :only-child :only-of-type
ボーダー	border-radius box-shadow
変形	transform

IE8では擬似クラスが使用できません。
また、背景や色に関わるCSS3も理解してくれません。

ボーダーに関しても使えないものがあるのでコーダーを悩ませます。
変形のtransformも使えないので最近開発・配布されたJavaScriptでも不具合が出たりします。
詳しい対応表はこちらから。

まとめ

CSS3でのコーディングではIE6からIE8がネックになります。
もちろん対応させる方法はありますが、その手間がコーダーを暗くさせます。
IEでCSS3が使える！「Selectivizr.js」と「CSS3 PIE」の使い方

あとIE6はTwitterをやっています。生みの親に「腐った牛乳」と呼ばれたIE6を是非フォローしてあげてください。
https://twitter.com/ie6bot