首頁 > 開發者 > JavaScript
關於Doctype、strict 模式與混雜模式，doctype混雜模式
<!Doctype> 文檔聲明，位於文檔中的最前面的位置，處於<html>標籤之前。此標籤告知瀏覽器文檔使用哪種HTML或XHTML規範。
用於告知瀏覽器以何種模式來渲染文檔。
strict 模式：頁面排版和js解析是以該瀏覽器支援的最高標準(W3C)來執行。
混雜模式：不嚴格按照標準模式執行，主要用以相容舊的瀏覽器，向後相容。類比老式瀏覽器的行為以防止老網站無法工作。說的透明點就是可以實現IE5.5及以下版本的瀏覽器的渲染模式。
Doctype不存在或格式不正確會導致文檔以混雜模式呈現。
那麼問題來了，strict 模式和混雜模式在樣式上有什麼不同之處？
區別：總體會有布局、樣式解析和指令碼解析三方面的區別。
1、盒模型：在W3C標準中，如果設定一個元素的寬度和高度，值得是元素內容的寬度和高度，而在Quirks模式下，IE的寬度和高度還包含了padding和border。
2、設定行內元素的寬高：在標準模式下，給<span>等行內元素設定width和height都不會生效，而在quirks模式下，則會生效。
3、設定百分比的高度：在標準模式下，一個元素的高度尤其包含的內容決定，如皋父元素沒有設定高度，子項目設定一個百分比的高度是無效的。
4、margin:0 auto設定水平置中：使用margin:0 auto在標準模式下可以使元素水平置中，但在quirks模式下卻會失效。解決辦法：用text-align屬性：
body{text-align:center;}
#content{text-align:left;}
5、quirks模式下設定圖片的padding會失效
6、quirks模式下Table中的字型屬性不能繼承上層的設定
7、quirks模式下white-space:pre（保留空白）會失效
那麼問題來了，white-space可能的值：
normal 預設。空白會被瀏覽器忽略
pre 空白會被劉看齊保留。其行為方式類似HTML中的<pre>標籤
nowrap 文本不會換行，文本會在在同一行上繼續，知道遇到<br>標籤為止
pre-wrap保留空白符序列，但是正常的進行換行
pre-line 合并空白符序列，但是保留分行符號。
inherit 規定應該從父元素繼承white-space屬性的值。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
