HTMLの形式が徐々に進化するにつれ、CSS も変化し続けています
CSS の解釈の仕方は二つあります
標準モード・・・W3Cの標準的仕様に準拠した解釈でページを表示する
互換モード・・・古い HTMLバージョン で書かれたページを表示する
ブラウザ(レンタリング・エンジン)によっては、デフォルトで使用されるモードがそれぞれ違うので、表示されたページのレイアウトが異なることがあります
以下の３つの方法を使用することで、表示の違いを防ぐことができます
１.「DOCTYPE宣言」し、Webページ 単位で設定する
２.Webサーバ上で HTTPヘッダ をカスタムし、Webサイト 全体を設定する
３.ブラウザでのモードの切り替えを行う
※１、２を両方設定されている場合は “１” が優先される
今回は、一番使用されると思われる、”１” の「DOCTYPE宣言」について説明します
「DOCTYPE宣言」は ソースの文頭でする必要があるので
<html>タグ よりも前でする必要があります
「DOCTYPE宣言」の種類と各ブラウザの対応状況は以下の表を参照してください
| (X)HTML形式 | DOCTYPE宣言 | IE(6) | NS(7) | FF(1) | OP(8) |
|---|---|---|---|---|---|
| — | 宣言なし | 互換 | 互換 | 互換 | 互換 |
| HTML4.01 Strict | <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”> | 標準 | 標準 | 標準 | 標準 |
| HTML4.01 Strict | <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”> | 標準 | 標準 | 標準 | 標準 |
| HTML4.01 Tranditional | <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”> | 互換 | 標準 | 標準 | 互換 |
| HTML4.01 Tranditional | <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”> | 標準 | 標準 | 標準 | 標準 |
| XHTML1.0 Strict | <?xml version=”1.0″ encoding=”…”?> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> | 互換 | 標準 | 標準 | 標準 |
| XHTML1.0 Tranditional | <?xml version=”1.0″ encoding=”…”?> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> | 互換 | 標準 | 標準 | 標準 |
| XHTML1.1 | <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”> | 互換 | 標準 | 標準 | 標準 |
IE・・・Internet Explorer、NS・・・Netscape、FF・・・Firefox、OP・・・Opera
()内はバージョン番号、バージョンによってデフォルトのモードが変わるものもある
