HTMLの種類を指定するDTD宣言
DTD宣言とは、使用する言語の種類と規格をブラウザに教えてあげるためのもの。
| HTMLの種類 | DTD宣言 |
|---|---|
| HTML4.01 Transitional | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01 Transitional//EN"> |
| HTML4.01 Frameset | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML4.01 Frameset//EN"> |
| HTML4.01 Strict | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML4.01//EN"> |
| XHTML1.0 Transitional | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| XHTML1.0 Frameset | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Frameset//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
| XHTML1.0 Strict | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
| XHTML1.1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.1//EN" "https://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| HTML5 | <!DOCTYPE html"> |
TransitionalはStrictに移行するまでのつなぎとしての規格であり、body直下に インライン、ブロック両要素を配置することができますが、Strictはブロックレベル要素しかおくことができません。
Transitionalは不完全なものでありStrictへの早めの移行が推奨されます。Firefoxでソース表示してみると赤字でエラーとして吐き出されます。
HTMLの全てのタグはインライン要素かブロックレベル要素に該当します。
インライン要素は名前のとおり直線のような要素で上下の余白（margin）をとることができず、マウス範囲も文字の上に限定されます。対してブロックレベル要素は四角のような要素で上下左右すべての余白を指定でき、文字の上以外の範囲もマウス範囲として指定できます。
このインライン要素とブロックレベル要素の違いは非常に重要ですので覚えておいてください。
で、どのHTMLがいいのか？
HTML5がIEの8以下に対応していないことを考えれば、素直にXHTML1.0で行くか、HTML5にしてIE8に対応させるJavascriptを読み込むかの2択となるかと思います。
ここではその2パターンについて解説します。
まず、XHTML1.0での宣言方法ですが、XHTMLの場合、DTD宣言のほかにXML宣言が必要になります。
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
バージョン宣言は必ず記述する必要があり、文字エンコーディング宣言とスタンドアロン宣言は必要に応じて記述すればよいことになっています。
エンコードはUTF-8を指定しておけば問題ありません。スタンドアロン宣言も この文書以外に参照すべきDTDがあるかどうかを指定するもので、XHTMLではどのバージョンでもnoで大丈夫です。
XHTML1.0でDTD宣言、XML宣言を加えると、
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> ここにヘッダ情報 </head> <body> ここに本文 </body> </html>
となります。
HTML5のほうはどうでしょうか。こっちはもっと簡単です。
<!DOCTYPE html> <html> <head> ここにヘッダ情報 </head> <body> ここに本文 </body> </html>
HTML5の場合は、ヘッダ情報のところにjsファイルを読み込む必要がありますが、それについては次の項で説明します。
コメントor補足情報orご指摘あればをお願いします。
- << 前のページ
- 次のページ >>
