IE7でHTMLに存在しない要素にスタイルシートを適用する方法
AjaxianとHTML5.JPでIE7以降で、HTML5の新要素にスタイルシートを適用する方法が紹介されていました。
ですが、この方法はどんな要素にも適用できるようです。
例えば、以下のようなHTMLがあったとします。
<html>
<head>
<style>
dummy { color:red; font-size:2em;}
</style>
</head>
<body>
<dummy>ここは<dummy>要素です。</dummy>
</body>
</html>
このHTMLは、IE7では以下のように表示されます。
FireFox2.0だとこうなります。
Opera9.24だとこうなります。
IE7だけスタイルシートが適用されていませんね。
このHTMLにJavaScriptを追加します(赤字部分)。
<html>
<head>
<style>
dummy { color:red; font-size:2em;}
</style>
<script>
document.createElement("dummy");
</script>
</head>
<body>
<dummy>ここは<dummy>要素です。</dummy>
</body>
</html>
これをIE7で表示してみると、正しくスタイルシートが適用されていることが分かります。
たった１つ命令を追加するだけですし、これは便利ですね。
(2008.1.28追記)
Multiple IE環境での確認ですが、IE5.01はこの方法はうまくいきませんでしたが、IE5.5,IE6では有効でした。今のIEのシェア状況を考えると、IE全般に適用できると考えてもよさそうですね。
| 固定リンク
トラックバック
この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/14182/10103108
この記事へのトラックバック一覧です： IE7でHTMLに存在しない要素にスタイルシートを適用する方法:
» 久々にHTMLの話 HTML5 [WEB Okanos Customize]
HTML5が話題になっているので試しに書いてみた。｜CSS HappyLife 久々にＨＴＭＬの話題を見つけて読んでみました。 ＨＴＭＬは現在4なので新しい規... [続きを読む]
受信： 2008/02/24 18:31
コメント