CSS 兼容模式是為了解決舊版瀏覽器無(wú)法識(shí)別新版 CSS 屬性、偽類(lèi)等問(wèn)題而設(shè)計(jì)的，使得新技術(shù)在舊版瀏覽器中也能夠正常顯示。該模式下的頁(yè)面在 IE 瀏覽器中會(huì)觸發(fā)怪異模式，出現(xiàn)樣式錯(cuò)亂現(xiàn)象，十分棘手。

/* CSS 兼容模式 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
/* 所有樣式都應(yīng)放在這里 */
}

在 IE11 中，兼容模式檢測(cè)到文檔類(lèi)型聲明缺失或者為不支持的文檔類(lèi)型時(shí)，IE11 在解析頁(yè)面時(shí)會(huì)使用混雜模式，此時(shí)會(huì)忽略標(biāo)準(zhǔn)模式的一些聲明，如盒模型等。因此，如果在編寫(xiě) CSS 樣式時(shí)沒(méi)有加上相應(yīng)的前綴或者 hack，頁(yè)面就會(huì)出現(xiàn)兼容性問(wèn)題。

為了解決這個(gè)問(wèn)題，我們可以使用包含 @media 的 CSS 兼容模式，在該模式下編寫(xiě)兼容性代碼，避免出現(xiàn)兼容性問(wèn)題。此外，我們也可以使用 CSS Reset 來(lái)抹平瀏覽器的差異問(wèn)題。

/* CSS Reset */
* {
margin: 0;
padding: 0;
border: 0;
}

除此之外，我們還應(yīng)該關(guān)注頁(yè)面編寫(xiě)規(guī)范，規(guī)范的 HTML 代碼、語(yǔ)義化標(biāo)簽都可以有效減少在不同環(huán)境下的兼容問(wèn)題。通過(guò)遵循 HTML 和 CSS 標(biāo)準(zhǔn)的規(guī)范編寫(xiě)代碼，我們可以提升網(wǎng)頁(yè)在各個(gè)瀏覽器中的兼容性。