为什么要用!DOCTYPE声明
實(shí)例:
我們經(jīng)常會(huì)看到類(lèi)似這樣的代碼:
<!DOCTYPE html> <html> <head> <title>文檔的標(biāo)題</title> </head> <body> 文檔的內(nèi)容...... </body> </html> 注解:可以看到最上面有一行關(guān)于“DOCTYPE”(文檔類(lèi)型)的聲明,它就是告訴瀏覽器,使用哪種規(guī)范來(lái)解釋這個(gè)文檔中的規(guī)范。你知道如果沒(méi)有它,瀏覽器在渲染頁(yè)面的時(shí)候會(huì)使用怪異模式(各個(gè)瀏覽器在怪異模式下對(duì)各個(gè)元素渲染時(shí)有差異,因此會(huì)導(dǎo)致同一個(gè)樣式在不同瀏覽器上看到的效果不同)。
定義和用法
<!DOCTYPE> 聲明必須是 HTML 文檔的第一行,位于 <html> 標(biāo)簽之前。
<!DOCTYPE> 聲明不是 HTML 標(biāo)簽;它是指示 web 瀏覽器關(guān)于頁(yè)面使用哪個(gè) HTML 版本進(jìn)行編寫(xiě)的指令。
在 HTML 4.01 中,<!DOCTYPE> 聲明引用 DTD,因?yàn)?HTML 4.01 基于 SGML。DTD 規(guī)定了標(biāo)記語(yǔ)言的規(guī)則,這樣瀏覽器才能正確地呈現(xiàn)內(nèi)容。
HTML5 不基于 SGML,所以不需要引用 DTD。
提示:請(qǐng)始終向 HTML 文檔添加 <!DOCTYPE> 聲明,這樣瀏覽器才能獲知文檔類(lèi)型。
HTML 4.01 與 HTML5 之間的差異
在 HTML 4.01 中有三種 <!DOCTYPE> 聲明。在 HTML5 中只有一種:
<!DOCTYPE html>HTML 元素和文檔類(lèi)型(Doctype)
請(qǐng)參閱這個(gè)?HTML 元素表,其中列出了每種元素會(huì)出現(xiàn)在哪個(gè)文檔類(lèi)型中。
提示和注釋
注釋:<!DOCTYPE> 聲明沒(méi)有結(jié)束標(biāo)簽。
提示:<!DOCTYPE> 聲明對(duì)大小寫(xiě)不敏感。
提示:請(qǐng)使用 W3C 的驗(yàn)證器來(lái)檢查您是否編寫(xiě)了有效的 HTML / XHTML 文檔!
常用的 DOCTYPE 聲明
HTML 5
<!DOCTYPE html>HTML 4.01 Strict
該 DTD 包含所有 HTML 元素和屬性,但不包括展示性的和棄用的元素(比如 font)。不允許框架集(Framesets)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">HTML 4.01 Transitional
該 DTD 包含所有 HTML 元素和屬性,包括展示性的和棄用的元素(比如 font)。不允許框架集(Framesets)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">HTML 4.01 Frameset
該 DTD 等同于 HTML 4.01 Transitional,但允許框架集內(nèi)容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">XHTML 1.0 Strict
該 DTD 包含所有 HTML 元素和屬性,但不包括展示性的和棄用的元素(比如 font)。不允許框架集(Framesets)。必須以格式正確的 XML 來(lái)編寫(xiě)標(biāo)記。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">XHTML 1.0 Transitional
該 DTD 包含所有 HTML 元素和屬性,包括展示性的和棄用的元素(比如 font)。不允許框架集(Framesets)。必須以格式正確的 XML 來(lái)編寫(xiě)標(biāo)記。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">XHTML 1.0 Frameset
該 DTD 等同于 XHTML 1.0 Transitional,但允許框架集內(nèi)容。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">XHTML 1.1
該 DTD 等同于 XHTML 1.0 Strict,但允許添加模型(例如提供對(duì)東亞語(yǔ)系的 ruby 支持)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">總結(jié)
(編寫(xiě)HTML時(shí))聲明文檔類(lèi)型:
<!DOCTYPE html>這樣聲明的好處:
- 你可以輕松的寫(xiě)下這個(gè)doctype,而不用擔(dān)心會(huì)寫(xiě)錯(cuò);
- 它是向后兼容的(因?yàn)镠TML5的doctype就是這樣寫(xiě)的),并且現(xiàn)代瀏覽器都認(rèn)識(shí)它。
疑問(wèn):沒(méi)有指定dtd將會(huì)開(kāi)啟瀏覽器的怪異模式?
? ? ? ?這種說(shuō)法是錯(cuò)的!正確的說(shuō)法應(yīng)該是沒(méi)有定義doctype才會(huì)開(kāi)啟怪異模式,也就是說(shuō)你只需要定義就可以讓瀏覽器在嚴(yán)格模式(標(biāo)準(zhǔn)模式)下渲染頁(yè)面,而不需要指定某個(gè)類(lèi)型dtd。
回顧一下:
? ? ? ?所有的瀏覽器都有兩種模式:怪異模式和嚴(yán)格模式(也有人叫標(biāo)準(zhǔn)模式)。IE 6 for Windows/mac, Mozilla, Safari和Opera 都實(shí)現(xiàn)了這兩種模式,但是IE 6以下版本永遠(yuǎn)定在了怪異模式。
關(guān)于兩種模式,你需要知道以下幾點(diǎn):
你可以看看這個(gè)清單:http://hsivonen.iki.fi/doctype/
注意:你可以根本不需要根據(jù)你選擇的doctype來(lái)驗(yàn)證你的頁(yè)面,只要doctype標(biāo)簽存在就足以開(kāi)啟嚴(yán)格模式(標(biāo)準(zhǔn)模式)了。如果仍感到懷疑,那么請(qǐng)前往http://www.quirksmode.org/css/quirksmode.html#link2了解你想知道的內(nèi)容。
我們只需要一小段JavaScript代碼就可以得到答案,它就是:
mode=document.compatMode;
這個(gè)代碼可以用來(lái)判斷,當(dāng)前瀏覽器是處于怪異模式還是標(biāo)準(zhǔn)模式,該屬性的兼容性毋庸置疑,如果你表示懷疑,可以查看http://www.quirksmode.org/dom/w3c_html.html#t11。
總結(jié)
以上是生活随笔為你收集整理的为什么要用!DOCTYPE声明的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 详解CSS选择器、优先级与匹配原理
- 下一篇: 地下城与勇士85级开不了发电站和克洛斯岛