|
|
|
|
|
今天寫CSS遇到一個(gè)非常奇怪的事情,就是想hack IE8,于是在樣式里加上“\0”,如下所示:
padding-top:0px\0;
但是一點(diǎn)效果都沒有,而一直這樣寫都是有效的。反而,我用IE7的hack寫法,成功了。寫法如下:
*padding-top:0px;
檢查起來是很痛苦很費(fèi)時(shí)的,好在最后找到了原因,原來是html的head里使用了如下的meta,導(dǎo)致hack IE8無效。
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
其實(shí),這句話是asp.net2.0創(chuàng)建網(wǎng)頁時(shí)自動(dòng)添加,我一直沒有過多研究,以致在新建html網(wǎng)頁時(shí),也把這些代碼直接拷貝過去使用,導(dǎo)致出現(xiàn)了現(xiàn)在的問題。
理解 IE=EmulateIE7 標(biāo)簽
Windows Internet Explorer 8 引入了文本兼容性模式,該模式允許 Web 開發(fā)人員將瀏覽器設(shè)置為以與舊版本相同的方式呈現(xiàn)它們的頁面??梢愿鶕?jù)不同的頁面或不同的站點(diǎn)指定兼容性模式。
通過meta標(biāo)簽,可實(shí)現(xiàn) Windows Internet Explorer 8 支持的一種很常見的文本兼容性模式 — EmulateIE7。寫法如下:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
EmulateIE7 是一種瀏覽器兼容模式,EmulateIE7 模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令確定如何呈現(xiàn)內(nèi)容,EmulateIE7 模式遵循 <!DOCTYPE> 指令。
要為網(wǎng)頁指定文本模式,請(qǐng)使用 META 元素,以在該網(wǎng)頁中包含 X-UA-Compatible http-equiv 標(biāo)頭。以下示例指定了 EmulateIE7 模式兼容性。
HTML:
<html>
<head>
<!-- Mimic Internet Explorer 7 -->
<title>我的網(wǎng)頁</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
</head>
<body>
<p>內(nèi)容在此處。</p>
</body>
</html>
Content 屬性指定了該頁面的模式;例如,要模仿 Windows Internet Explorer 7 的行為,請(qǐng)指定 IE=EmulateIE7。同樣,可指定 IE=5、IE=7 或 IE=8 以選擇其中一種兼容性模式。您還可以指定 IE=edge 以通知 Windows Internet Explorer 8 使用最高級(jí)別的可用模式。
X-UA-compatible 標(biāo)頭不區(qū)分大小寫;但是,它必須顯示在網(wǎng)頁中除 TITLE 和其他 META 元素以外的所有元素之前的標(biāo)頭(HEAD 部分)中。
IE=EmulateIE7 標(biāo)簽應(yīng)該摒棄
現(xiàn)在瀏覽器中極少人使用IE7以下的版本了,如果html網(wǎng)頁里還是用IE=EmulateIE7這樣標(biāo)簽,即是IE8也以IE7的CSS標(biāo)準(zhǔn)來呈現(xiàn)網(wǎng)頁,而針對(duì)IE8的CSS就不起作用了,這對(duì)CSS的編寫和維護(hù)帶來極大的麻煩。
因此,應(yīng)該摒棄IE=EmulateIE7 標(biāo)簽,在html網(wǎng)頁里刪除如下mata:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
如果你想兼容IE7瀏覽器,那么可以單獨(dú)hack IE7,CSS的寫法是在前面加一個(gè)“*”號(hào),如下所示:
*padding-top:0px;