IE中的條件註釋(<!--[if lt IE 7]><![endif]-->)

 

條件註釋只能用於Explorer 5+ Windows(以下簡稱IE).
如果你安裝了多個IE,條件註釋(Conditional comments)將會以最高版本的IE爲標準(一般爲IE 6)。
 我聽說(但沒測試過),當在條件註釋中使用了小數點,且只安裝了IE5.0的時候,將會產生一個不正確的判斷。

條件註釋只能在windows Internet Explorer(以下簡稱IE)下使用,因此我們可以通過條件註釋來爲IE添加特別的指令。條件註釋從IE5開始被支持,它可能在IE5.0,5.5,6裏有區別。
 我(譯者注:指作者)自己也在頂層的框架中使用了一些條件註釋。如果你以源代碼形式查看本頁,你將會看到:

<!--[if IE]>

<style>

div.logo {

margin-left: 10px;

}

</style>

<![endif]-->

以上代碼的作用是:
 一般情況下,div.logo的left margin將爲22px。但是,IE有個BUG,就是當它碰到浮動元素(floated elements)的margins時候,它將會以2倍於該元素的實際margin值來處理。所以我要告訴IE,這個元素是10px(10?11?)。於是我用條件註釋告訴了它。

 這些代碼例子將會概括性地說明你能如何使用條件註釋以及你不能如何使用條件註釋。

  1. 條件註釋的基本結構和HTML的註釋(<!-- -->)是一樣的。因此IE以外的瀏覽器將會把它們看作是普通的註釋而完全忽略它們。 

  2. IE將會根據if條件來判斷是否如解析普通的頁面內容一樣解析條件註釋裏的內容。 

  3. 條件註釋使用的是HTML的註釋結構,因此他們只能使用在HTML文件裏,而不能在CSS文件中使用。我很想把所有特殊的樣式放在logo.css裏。但是很不幸的是,這看起來不太可能。我也試過根據條件註釋,使用<link>來導入一個額外的樣式表,但是因爲我只需要一個額外的樣式規則,這樣會讓事情變得複雜很多。當然如果你需要在IE裏使用很多的額外的樣式,那麼使用<link>或許是一個好的方法。 

例子: 下面我放置了一些條件判斷來根據你的IE版本來輸出相應信息。(如果你使用的瀏覽器不是IE,你將會什麼都看不到)(譯者注:由於我的BLOG的問題,目前即使是IE也看不到任何東西。)

代碼如下:

<!--[if IE]>
根據條件判斷,這是Internet Explorer<br />
< ![endif]-->
<!--[if IE 5]>
根據條件判斷,這是Internet Explorer 5<br />
< ![endif]-->
<!--[if IE 5.0]>
根據條件判斷,這是Internet Explorer 5.0<br />
< ![endif]-->
<!--[if IE 5.5]>
根據條件判斷,這是Internet Explorer 5.5<br />
< ![endif]-->
<!--[if IE 6]>
根據條件判斷,這是Internet Explorer 6<br />
< ![endif]-->
<!--[if gte IE 5]>
根據條件判斷,這是Internet Explorer 5 或者更高<br />
< ![endif]-->
<!--[if lt IE 6]>
根據條件判斷,這是版小於6的Internet Explorer<br />
< ![endif]-->
<!--[if lte IE 5.5]>
根據條件判斷,這是Internet Explorer 5.5或更低<br />
< ![endif]-->

注意兩個特殊的語法:

  • gt: 大於 

  • lte: 小於或等於 

CSS hack? 條件判斷屬於CSS hack嗎?嚴格地說是屬於CSS hack。因爲就好象其他真正的css hack一樣,它使得我們可以給一些瀏覽器賦予特殊的樣式,再則它不依賴於某個瀏覽器的BUG來控制另外一個瀏覽器(的樣式)。除此之外,條件判斷還能用來做一些超出CSS HACK範圍的事情(雖然這種情況很少發生).。

 因爲條件判斷不依賴於某個瀏覽器的hack,而是一個經過深思熟慮的特色功能,所以我相信它是可以被放心地使用的。當然,其他瀏覽器也有可能支持條件判斷(到目前爲止還沒有),但是看起來,他們應該不會使用如<!--[if IE]>這樣的語法。

 我很節儉地使用條件判斷。首先我會嘗試着去尋找在IE上一個真正的CSS解決方法。如果找不到,我將會毫不猶豫地使用條件判斷。

Comment標籤:
一個讀者告訴我,IE(Windows和Mac)支持<comment>標籤(非標準)。

<p>這 <comment>不</comment> 是Internet Explorer.</p>

這 是Internet Explorer.

如果你想爲非IE的瀏覽器使用專門的標籤或樣式,那麼這個這個comment標籤將會非常方便。不幸地是,這種情況很少發生(譯者注:IE太爛?呵呵)。特別是這個標籤,同時被windows和mac平臺上的IE支持,而你往往只想在他們其中之一使用特殊的內容或樣式。

 

出自http://www.cnblogs.com/poissonnotes/archive/2010/05/28/1745996.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章