以前在寫網頁都是從 <html>...</html>, 不知道何時開始, 習慣都會在第一行加上 <!DOCTYPE ...>, 一般都只想到就是要把他宣告成 XHTML, XML, HTML, 後來研究 DTD 後才了解, 原來這一行不是那麼簡單的隨便加一加而已.. XD
加 <!DOCTYPE...> 這行的用意在於說, 一般 Broswer 有自己對 HTML Tag 的解釋, 但是想要符合各種的 Broswer 的話該怎麼辦呢? 於是這就需要統一的規格, 此 <!DOCTYPE...> 就是規範此規格, 所有 Broswer 如果看到此行, 會去看此 URL 的 DTD 規範, 依照此規範去解釋 HTML Tag, 因此就比較不會有不相容的狀況發生, 而此規範通常都是採用 W3C 規定的標準為主.
而目前有哪些 <!DOCTYPE ..> 的宣告, 以下列表取自於A List Apart: Articles: Fix Your Site With the Right DOCTYPE!
:
HTML 4.01 Strict, Transitional, Frameset
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict, Transitional, Frameset
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.1 DTD
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
以上寫法, 要就連成一行, 如果要斷行, 必須要在 //EN" 此處斷行.
在撰寫此標準 HTML 時, 經常使用的網站列表:
- HTML 4.01 建議規格
- HTML 4 DTD: HTML 4 Document Type Definition
- W3C 標準驗證服務 - 可以用來檢查是否有 Html Error
- DTD 教學
- HTML 文件的架構
- IE and the CSS Box Model: Wronger than Wrong - 這篇有用圖片解釋套 DOCTYPE 的差別
- Quirks mod(Wikipedia) - 各種型態的 DOCTYPE 於瀏覽器的相容性表格
- MSDN DOCTYPE
- Activating Browser Modes with Doctype
DTD 是用來定義 tag language 的格式，主要是用來驗證文件是否文法上正確。DTD 並不包含 TAG 的 sematic，不能用來解釋 tag，因此和相容性無關。只是，如果你使用比較嚴格的 DTD ，自然驗證文件時，會以比較嚴格的標準檢驗。一旦經過檢查的文件，自然比較出現錯誤的 tag 用法。但，對於 tag 的解釋，卻是存在於 browser 的render ，不受 DTD 影嚮。
我上面寫的"解釋", 意思指的是"格式", 是我太不會用詞了.. Orz...
非常感謝您的指點, 讓我對 DTD 又更加了解了~ 🙂
那我想請問一下 設定不同的DocType 除了無法通過文件驗證
對於網頁展示上 或是應該說使用者在使用網頁上有什麼影響嗎??
主要影響比較大的會是 IE, IE 會啟動自己的標準, 照它自己的標準, 你會發現頁面出來的樣式會有偏差, ex: 多 幾px 或少 幾px 之類的.
原來如此!! 感謝!!
但似乎即使加上了DocType , 不同Browser也會有點差異!!~~
嗯嗯, 加上去只是說, 大家是照這個標準走, 但是同樣一份 w3c 訂出來的 spec, 大家看的跟想的多少會有點不同, 所以寫出來的瀏覽器一些數值或判斷會有些不一樣.
才會有 javascript/css 在不同瀏覽器有些有問題的狀況, 所以通常我都還會加上 css reset 來做, 把所有東西歸 0 後, 再加上 css base(這個不一定會加), 把標準再統一化一次, 再開始寫~ 😛
(雖然這樣子還是會有些不同, 但是至少尺寸等等的, 會比較統一, 比較不會有某些瀏覽器突然多幾 px 的狀況.)
請問， 可以多重宣告嗎？
EX:
＜!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"＞
＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"＞
同時宣告。
（抱歉，前文貼有 HTML tag 致不能顯示，請格主刪了吧！）
要多重宣告的話, 那就挑寬鬆的宣告囉~ 🙂