什么是標准模式和怪異模式？
在實現html和css標准化之前，各個瀏覽器對html和css的解析各有不同，甚至是同一個瀏覽器的不同版本渲染方式也不同（比如IE6和IE7）。在W3C制定標准之后，瀏覽器既要按照標准去實現HTML和CSS的支持，又要保證能夠兼容以前的非標准的舊網頁，於是就有了現在所說的標准模式（嚴格模式）和兼容模式（怪異模式）。
瀏覽器如何確定渲染模式呢？
在編寫HTML文檔時，一般都會在文檔的開頭，html標簽之前聲明文檔類型：DOCTYPE，當瀏覽器在解析html文檔時，若遇到正確的文檔聲明，則啟用標准模式，按照標准來解析和渲染文檔。而對於舊的html文檔，或沒有DOCTYPE聲明的文檔，則按照怪異模式來解析文檔。html5的文檔聲明方式：<!DOCTYPE HTML> 。
標准模式和怪異模式的區別？
1、width不同
在標准模式中：width是內容（content）寬度，元素真正的寬度是外邊距、內邊距、邊框寬度的和，即元素寬度 = margin-left + border-left-width + padding-left + width + padding-right + border-right-width + margin-right。
在怪異模式中：width則是元素的實際寬度，width = border-left-width + padding-left+ 內容(content)寬度 + padding-right + border-right-width。
2、內聯元素的尺寸
標准模式中，給span等行內元素設置width和height都不會生效，而在怪異模式下，卻會生效。
3、可設置百分比的高度
在標准模式下，一個元素的高度由其包含的內容content決定，如果父元素沒有設置高度，子元素設置一個百分比高度是無效的。
4、用margin : 0 auto設置水平居中
在標准模式下可以使元素水平居中，但是在怪異模式下，無效，可以用text-align : center;來實現居中。
5、怪異模式下設置圖片的padding會失效
6、怪異模式下table中的字體屬性不能繼承上層的設置
7、元素溢出的處理
標准模式下，overflow默認去visible，在怪異模式下，溢出會被當做擴展box來對待，溢出不會裁減，元素框自動調整大小，能夠包含溢出內容。