兼容性問題
目前市面上流行的瀏覽器有多種，這些瀏覽器在處理一個相同的頁面時，表現或行爲有時會有差異。
這種差異可能很小，甚至不會被注意到；也可能很大，甚至造成在某個瀏覽器下無法正常瀏覽。
我們把引起這些差異的問題統稱爲“瀏覽器兼容性問題”。
瀏覽器的內核
各品牌瀏覽器的內核是不同的，不同的內核處理同一段代碼的時候思路不同。因此可以說，瀏覽器間內核的差異是產生兼容性問題的根本原因。
“內核”也稱爲“引擎”。常見的瀏覽器及其渲染引擎（又稱排版引擎）、腳本引擎的列表1如下：
| Browser Name | Layout Engine | ECMAScript Engine |
|---|---|---|
| Internet Explorer 6 - 8 | Trident | JScript |
| Firefox 3.5 | Gecko | TraceMonkey |
| Chrome 4 | WebKit | V8 |
| Safari 4 | WebKit | SquirrelFish Extreme |
| Opera 10 | Presto | Carakan |
注：
關於瀏覽器內核的更多信息，請參考 維基百科 - 排版引擎 及 維基百科 - 網頁瀏覽器比較 中的相關內容。
瀏覽器的工作模式
工作模式簡介
瀏覽器的工作模式常被稱爲“渲染模式”。實際上瀏覽器不同的工作模式不僅對渲染有影響，對代碼的解析以及腳本的行爲也同樣有影響。
從更廣泛的角度來看，瀏覽器的工作模式的差異不僅體現在處理 HTML 頁面的時候，處理 XML 及一些非 WEB 內容時也有模式上的差異，但本文僅討論瀏覽器在處理 HTML 頁面時工作模式。1
注：
關於瀏覽器的工作模式的更多信息，請參考 Activating Browser Modes with Doctype。
工作模式的來源及變遷
微軟於 2001 年 8 月 27 日發佈的 IE6（Internet Explorer 6）增強了對 CSS1 的兼容1，這使得 IE6 對 CSS 的解析及渲染與它的前一個版本 IE5.5 有了很大的差別，如對盒模型的理解2、表格尺寸的算法3等。
爲了保持良好的向後兼容性，微軟爲用戶提供了一個“開關”，來決定瀏覽器的工作模式4，這個“開關”就是頁面頂部的 DTD。
某些 DTD 將使 IE6 工作在“標準兼容模式”（即“標準模式”），這種模式使用了 IE6 最新的處理方式，包括對 CSS1 的兼容及一些 DHTML 方面的增強。
而另一些 DTD，包括不設置 DTD 將使 IE6 工作在“向後兼容模式”（即“混雜模式”），這種模式對頁面的處理是與 IE5.5 保持一致的，這樣就可以保證對一些在 IE5.5 中表現良好的頁面在 IE6 中也能達到同樣的效果。
微軟在後續推出的 IE7、IE8 中，也使用了上述“開關”，與 IE6 一樣，在 IE7、IE8 的“混雜模式”下，對頁面處理方式仍與 IE5.5 一致。因此可以說，IE 系列的“混雜模式”，將瀏覽器的行爲凍結在了 IE5.5 這個版本，雖然 IE 各版本的混雜模式也略有區別5，但它們的本意都是向後兼容。
隨着時間的推進和標準的進步，IE6、IE7 的“標準模式”逐漸已經變得不夠標準了，2009年3月19日發佈的 IE8 重新定義了“標準模式”，再次增強了對標準規範的支持，同時爲了保持對 IE7 的兼容，IE8 增加了一種工作模式：“接近標準模式”。於是，IE8 的工作模式就分成了三種：“標準模式”、“接近標準模式”和“混雜模式”6。
目前所有主流瀏覽器對於向後兼容問題的處理都與 IE 系列一樣，提供了不同的模式7來保證向後兼容。
瀏覽器的工作模式就是在這種背景下誕生的，它很好的解決了瀏覽器對標準支持上的不斷增強及對一些錯誤的修復而導致的向後兼容問題，但也將瀏覽器在不同情況下的表現及行爲變得更加複雜多樣。
通過以上的內容，我們可以得出結論：如果一個頁面能使各瀏覽器都工作在“標準模式”下，那麼各瀏覽器都將盡量兼容標準，因此各瀏覽器之間表現出的差異是很少的。相反，如果一個頁面使各瀏覽器都工作在“混雜模式”下，那麼各瀏覽器都將盡量向後兼容，因此各瀏覽器之間表現出的差異將會最大化。
注：
關於 IE6 的更多信息，請參考 維基百科 - Internet Explorer 6。
關於此問題，請參考 W3H - RD8001: 各瀏覽器中 'width' 和 'height' 在某些元素上的作用位置有差異。
關於此問題，請參考 W3H - RE8017: IE Firefox Opera 的混雜模式對於 TD 元素的百分比高度計算錯誤。
關於 IE6 對瀏覽器工作模式的區分的詳細信息，請參考 MSDN - CSS Enhancements in Internet Explorer 6。
比如 IE6 的混雜模式有著名的“雙邊距 Bug”，而 IE7 和 IE8 的混雜模式則沒有這個問題。
關於此問題，請參考 W3H - RX2001: IE5.0 IE5.5 IE6 中浮動元素在某些情況下會有雙倍外邊距。document.compatMode 最先出現在 IE6 中，它的值標示了瀏覽器的工作模式，“標準模式”返回“CSS1Compat”，“混雜模式”返回“BackCompat”。這一做法到目前爲止仍被所有主流瀏覽器所採用。
需要注意的是：在後來出現的“接近標準模式”中，document.compatMode 的返回值與“標準模式”一致，爲“CSS1Compat”。也就是說，不能通過 document.compatMode 來詳細區分瀏覽器的工作模式，只能用來判斷瀏覽器是否工作在“混雜模式”下。
因爲“標準模式”與“接近標準模式”之間的差異並不大，所以這個方法至今仍被廣泛使用。關於 Firefox 中 DTD 與瀏覽器工作模式的詳細信息，請參考 Mozilla's DOCTYPE sniffing，關於 Opera 中 DTD 與瀏覽器工作模式的詳細信息，請參考 DOCTYPE Switches support in Opera Presto 2.6。
附錄: 一些常見的 doctype
Q 代表“混雜模式”，A 代表“接近標準模式”，S 代表“標準模式”。
建議
在編寫一個頁面時，要使用可以觸發各瀏覽器“標準模式”的DTD，並書寫符合規範的代碼，以保證您的頁面在各瀏覽器中可以最大程度的兼容。