怪異模式（Quirks Mode）對 HTML 頁面的影響：
http://www.ibm.com/developerworks/cn/web/1310_shatao_quirks/
模式？標準！
http://padding.me/blog/2014/07/04/mode-or-standard/
關於瀏覽器模式和文本模式的困惑
https://www.imququ.com/post/browser-mode-and-document-mode-in-ie.html
Q: doctype（文檔類型）的作用是什麼？
A: 在HTML中 doctype 有兩個主要目的。
對文檔進行有效性驗證:
它告訴用戶代理和校驗器這個文檔是按照什麼DTD 寫的。這個動作是被動的，每次頁面加載時，瀏覽器並不會下載DTD 並檢查合法性，只有當手動校驗頁面時才啓用。
決定瀏覽器的呈現模式:
對於實際操作，通知瀏覽器讀取文檔時用哪種解析算法。如果沒有寫，則瀏覽器則根據自身的規則對代碼進行解析，可能會嚴重影響HTML 排版佈局。瀏覽器有三種方式解析HTML文檔。
非怪異（標準）模式
怪異模式
部分怪異（近乎標準）模式
關於IE瀏覽器的文檔模式，瀏覽器模式，嚴格模式，怪異模式，DOCTYPE標籤，可詳細閱讀模式？標準！的內容。
Q: 瀏覽器標準模式和怪異模式之間的區別是什麼？
A: 在“標準模式”(Standards Mode) 頁面按照 HTML 與 CSS 的定義渲染，而在“怪異模式”(Quirks Mode)就是瀏覽器爲了兼容很早之前針對舊版本瀏覽器設計、並未嚴格遵循 W3C 標準的網頁而產生的一種頁面渲染模式。瀏覽器基於頁面中文件類型描述的存在以決定採用哪種渲染模式；如果存在一個完整的DOCTYPE則瀏覽器將會採用標準模式，而如果它缺失則瀏覽器將會採用怪異模式。
強烈建議閱讀加深理解：怪異模式（Quirks Mode）對 HTML 頁面的影響，這裏列下瀏覽器標準模式和怪異模式的區別：
盒模型：
在怪異模式下，盒模型爲IE盒模型而非標準模式下的W3C 盒模型：在 IE 盒模型中，
box width = content width + padding left + padding right + border left + border right，
box height = content height + padding top + padding bottom + border top + border bottom。
而在 W3C 標準的盒模型中，box 的大小就是 content 的大小。
圖片元素的垂直對齊方式:
對於inline元素和table-cell元素，在 IE Standards Mode 下 vertical-align 屬性默認取值爲baseline。而當inline元素的內容只有圖片時，如table的單元格table-cell。在 IE Quirks Mode 下，table單元格中的圖片的 vertical-align 屬性默認爲bottom，因此，在圖片底部會有幾像素的空間。
<table>元素中的字體:
CSS 中，描述font的屬性有font-family，font-size，font-style，font-weigh,上述屬性都是可以繼承的。而在 IE Quirks Mode 下，對於table 元素，字體的某些屬性將不會從body或其他封閉元素繼承到table中，特別是 font-size屬性。
內聯元素的尺寸:
在 IE Standards Mode 下，non-replaced inline 元素無法自定義大小，而在 IE Quirks Mode 下，定義這些元素的width和height 屬性，能夠影響該元素顯示的大小尺寸。
元素的百分比高度:
CSS 中對於元素的百分比高度規定如下，百分比爲元素包含塊的高度，不可爲負值。如果包含塊的高度沒有顯式給出，該值等同於“auto”（即取決於內容的高度）。所以百分比的高度必須在父元素有聲明高度時使用。
當一個元素使用百分比高度時，在 IE Standards Mode 下，高度取決於內容的變化，而在 Quirks Mode 下，百分比高度則被正確應用。
元素溢出的處理：
在 IE Standard Mode 下，overflow取默認值 visible，即溢出可見，這種情況下，溢出內容不會被裁剪，呈現在元素框外。而在 Quirks Mode 下，該溢出被當做擴展box來對待，即元素的大小由其內容決定，溢出不會被裁剪，元素框自動調整，包含溢出內容。