Movatterモバイル変換


[0]ホーム

URL:


アットマーク・アイティ ITエキスパートのための問題解決メディア
@IT > IE 6とIE 7のためのCSSハック16選
Webブラウザ別CSSハック&フィルタTips

 前回の「IE 6で泣かないための、9つのCSSハック」では、仕様通りの正しいコーディングを行っているにもかかわらず、Internet Explorer(以下、IE) 6で見ると、レイアウトがズレてしまうなどのさまざまな問題を解決するための9つのテクニックを紹介しました。

 今回は、IE 6とIE 7のためのCSSハックのテクニックを下記に分けて紹介します。

 これらを表にまとめます。検証Webブラウザは、下記の通りです。

  • Windows:IE 6、IE 7、IE 8、Firefox 3.5、Safari 4、Chrome 3、Opera 10
  • Mac OS X:IE 5、Firefox 3.5、Safari 4、Opera 10
  • IE 6以外のすべてのWebブラウザで読み込む → IE 6のハックとして機能する
  • 逆に、IE 6だけ読み込む → IE 6のハックとして機能する

 どちらの場合にしてもIE 6とほかのWebブラウザとの挙動を分けられるので、IE 6用のハックとして分類できることになります。また、そのほかのWebブラウザのハックに関しても同じ分け方です。

 ちなみに、Mac OS XのIE 5のシェアは皆無といっていいレベルなので、Mac OS XのIE 5以外のWebブラウザを分類する際には、Mac OS XのIE 5の○×は無視してあります。

 今回、紹介するCSSハックは、主に<p>要素を例にしていますが、ほかの要素でも書き方を同じにして、pの部分を書き換えれば適用できます。ただし一部のハックでは、要素が限定されるものもあります。

 CSSハックの基本については、下記記事をご参照ください。この記事はCSSの基本を紹介する連載「いまさら聞けないCSS/スタイルシート入門」に含まれますので、CSS自体の基本を抑えたい方は連載を通してご参照ください。

http://www.atmarkit.co.jp/fwcr/design/index/index_css.html

 


IE 6とIE 7のためのCSSハック16選
 
 

[an error occurred while processing this directive]



HTML5 + UX フォーラム 新着記事
デザインハック

注目のテーマ

デザインハック 記事ランキング

本日月間



Copyright © ITmedia, Inc. All Rights Reserved.

[8]ページ先頭

©2009-2025 Movatter.jp