DTD 標準準拠モードか後方互換モードか
DOCTYPE を指定してブラウザに標準準拠モードか後方互換モードか宣言するわけだが、まずはこの標準準拠モードと、後方互換モードを復習しましょう。
標準準拠モード
Ｗ3Ｃが推奨する、いわゆる世界標準の表示モード。
つまりこれから先、世界標準の標準準拠モードでサイト作ってれば問題なしになるはず。
後方互換モード
後方（過去）互換とは、IE6以下に互換性を持たせるモード。
IE6以下の標準準拠モードに対応していない古いブラウザでの表示を考えたモード。
基本的に標準準拠モードで動作させる
では表示モードの切り替え「DTD」とは何か？
HTML文書の先頭、または先頭付近にあるコードの事です。
具体的な一例を以下に。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
このDTDの記述を変える事で「標準準拠モード」と「後方互換モード」と切り替えることができます。
当然ですが、W3C推奨の世界標準モードを使いましょう。
しかし困った事にIE6にはバグがあり、DTDがHTML文書の先頭にないと過去互換モードになってしまいます。
先頭にもってこれば標準準拠モードで動作しますが、XML宣言をして、その次に標準準拠モードを宣言すると、後方互換モードで動作してしまう。
まったく厄介なIE6。
IE6を標準準拠モードで動作させるためには、XML宣言が出来ないという事になりますね。
過去互換モード。ボックス要素の解釈の違い
「後方（過去）互換モード」でのFirefoxとIEの大きな違いが、ボックス要素の解釈の違いです。
ボックスモデルの解釈が違うためにレイアウトの崩れがおきてしまいます。
Firefoxだとちゃんと表示されるレイアウトがIEだと崩れるのはこのボックス要素の解釈の違いが原因。
これを回避するためにはCSSを工夫しなくちゃならない。
どう解釈が違うかは、「Firefox ＩＥ の表示の違いをまとめてみる 」を読み返してください。
PNGはキレイに表示されない GIFまたはJPGを使う
IE6では背景に指定したPNG画像は表示されないというバグもある。
また透過PNGも透過されない。
全くやっかいなIEである。
JPGは透過しないから、背景と重なる部分などはJPG側で工夫が必要になるし、背景を変えるようなデザイン変更を行う場合はJPGも作り直さなければならない。
やっぱり僕は世界標準のFirefoxをオススメしますね。
実際IEのシェアは落ちてるしな。
でもWindowsにデフォルトで装備されてるIE。
これからもIEは無視できないなぁ・・・
世間のサイトはけっこう問題なくFirefoxでもIEでも表示できるよなぁ
僕ももっと勉強しなくては。
次は「DTD」についてもっと詳しく触れていきます。
「Firefox IEの表示の違い クロスブラウザ、ブラウザ互換 DTD」
- posted：2007/09/30：Sun
- 23 ： 28： 09
- ：ブラウザ
- ：Firefox ＩＥ 悩み CSS
- ：RSS
- comments : 0
- trackbacks : 0
- ：edit
Comments
What say you?
Track backs
http://digdagdig.blog117.fc2.com/tb.php/86-81776594
