簡單聊一下DOCTYPE

01-31

大家在學習HTML的時候，是不是也發現了在HTML文檔的最上邊第一句語句都是<!DOCTYPE HTML>。那小夥伴們有沒有想過，<!DOCTYPE HTML>標籤是什麼意思，幹什麼用的呢？我是前端小白，所以理解的也不是很深入，所以還請大家見諒與指正，哈哈~

<!DOCTYPE HTML>是什麼？

它是html5標準網頁聲明,全稱為Document Type HyperText Mark-up Language。

<!DOCTYPE HTML>聲明應該放在HTML文檔最前面的位置。在<html>標籤之前，告訴瀏覽器解析器應該使用什麼樣的文檔類型來解析文檔。

另外在說一下：

在 HTML 4.01 中，<!DOCTYPE> 聲明引用 DTD，因為 HTML 4.01 基於 SGML。DTD 規定了標記語言的規則，這樣瀏覽器才能正確地呈現內容。在 HTML 4.01 中有三種 <!DOCTYPE> 聲明：

1、嚴格模式：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

2、過渡模式：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

3、基於框架的 HTML 文檔：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

HTML5 不基於 SGML，所以不需要引用 DTD。在 HTML5 中只有一種：

<!DOCTYPE html>n

還是HTML5的聲明簡單好記。

作用：聲明文檔的解析類型(document.compatMode)，避免瀏覽器的怪異模式。

document.compatMode（用來判斷當前瀏覽器採用的渲染方式）：

ttBackCompat：怪異模式，瀏覽器使用自己的怪異模式解析渲染頁面。

ttCSS1Compat：標準模式，瀏覽器使用W3C的標準解析渲染頁面。

如果你的文檔中沒有添加<!DOCTYPE HTML>聲明,那麼瀏覽器就會默認使用怪異模式解析渲染頁面。而且不同的瀏覽器都使用自己的默認渲染模式，顯示出來的頁面樣式也會不同，這樣就很頭痛了~

所以我們需要在文檔中加上<!DOCTYPE HTML>聲明，這樣瀏覽器就會開啟標準模式，乖乖的按照W3C的標準來解析渲染頁面啦，我們的頁面在不同的瀏覽器裡面也就顯示一樣的頁面效果啦~

這就是<!DOCTYPE HTML>的作用~~~

要注意哦：

* 一定要在 HTML 文檔添加 <!DOCTYPE> 聲明，這樣瀏覽器才能獲知文檔類型。

* <!DOCTYPE> 聲明必須是 HTML 文檔的第一行，位於 <html> 標籤之前。

* <!DOCTYPE> 聲明對大小寫不敏感的

* <!DOCTYPE> 聲明沒有結束標籤

想要了解document.compatMode---

document.compatMode介紹 - 依水間 - 博客園