DDOCTYPE 有很多種, 除了識別html / xhtml版本, 也告訴瀏覽器該以哪一種模式顯示網頁
W3C (http://www.w3.org/TR/html401/struct/global.html#version-info) 公佈HTML 4.01的三種寫法如下:
<!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">
DTD 就是「文件類型定義」（document type definition）的縮寫。Strict對html採嚴格定義, 禁止使用過時語法; Transitional採比較寬容定義, 允許使用部份即將過時語法; Frameset是frame網頁使用
瀏覽器顯示可以簡單歸結成二種: 標準模式(standard mode)和相容模式(quirks mode)
加網址的顯示為"標準模式", 不加網址的顯示為"相容模式", 不加宣告的則反應為 "相容模式"
目前常用的html宣告為 (標準模式) --> 有加網址
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
還有一種html宣告為 (相容模式) --> 沒加網址
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
老舊版本的瀏覽器多半是相容模式, 新的標準的瀏覽器則是標準模式
有支援切換宣告模式的瀏覽器為IE6以上, Netscape6以上, Firefox1以上版本
二種模式的差異為: 標準模式 CSS padding寬度外加, 相容模式 CSS padding寬度內含 (所以造成寬度顯示不同)
舉例: IE5, IE5.5, IE6 + 第一行xml宣告 --> 會顯示為相容模式
IE6, IE7, Firefox1.0, Netscape6.0 --> 會顯示為標準模式
(但是IE6 + 第一行xml宣告 顯示為相容模式 (IE6 bug 之一), 在IE7和firefox不管有沒有 + 第一行xml宣告 都會顯示為標準模式)
為了畫面正常而拿掉宣告不是很好的解決方式, 採用不加網址的宣告則不確定是否符合無障礙規範, 設計時仔細檢查調整css各區塊padding的設定應該都能解決
沒有留言:
張貼留言