IE條件註釋詳解

Web開發者發表於2011-12-20

IE條件註釋是微軟從IE5開始就提供的一種非標準邏輯語句,作用是可以靈活的為不同IE版本瀏覽器匯入不同html元素,如:樣式表,html標籤等。很顯然這種方法的最大好處就在於屬於微軟官方給出的相容解決辦法而且還能通過W3C的效驗。

讓我們舉幾個例子來看看:

1、只有IE才能識別 

<!--[if IE]>
 <link type="text/css" rel="stylesheet" href="my.css" />
<![endif]-->

因為只有IE5以上的版本才開始支援IE條件註釋,所有“只有IE”才能識別的意思是“只有IE5版本以上”才能識別。

2、只有特定版本才能識別

<!--[if IE 8]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

識別特定的IE版本,高了或者低了都不可以。上例只有IE8才能識別。

3、只有不是特定版本的才能識別

<!--[if !IE 7]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

上例中特定IE7版本不能識別,其他版本都能識別,當然要在IE5以上。

4、只有高於特定版本才能識別

<!--[if gt IE 7]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

上例中只有高於IE7的版本才能識別。IE7無法識別。

5、等於或者高於特定版本才能識別

<!--[if gte IE 7]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

上例中IE7和更高的版本都能識別。

6、只有低於特定版本的才能識別

<!--[if lt IE 7]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

上例中只有低於IE7的版本才能識別,IE7無法識別。

7、等於或者低於特定版本的才能識別

<!--[if lte IE 7]> 
<link type="text/css" rel="stylesheet" href="my.css" />   
<![endif]-->

上例中IE7和更低的版本可以識別。

關鍵詞解釋

上面那些程式碼好像很難記的樣子,其實只要稍微解釋一下關鍵字就很容易記住了。

lt :就是Less than的簡寫,也就是小於的意思。

lte :就是Less than or equal to的簡寫,也就是小於或等於的意思。

gt :就是Greater than的簡寫,也就是大於的意思。

gte:就是Greater than or equal to的簡寫,也就是大於或等於的意思。

!:就是不等於的意思,跟javascript裡的不等於判斷符相同。

這樣解釋一下,是不是好記多了。

特別提示:

1、有人會試圖使用<!--[if !IE]>來定義非IE瀏覽器下的狀況,但注意:條件註釋只有在IE瀏覽器下才能執行,這個程式碼在非IE瀏覽下被當做註釋視而不見。

2、我們通常用IE條件註釋根據瀏覽器不同載入不同css,從而解決樣式相容性問題的。其實它可以做的更多。它可以保護任何程式碼塊——HTML程式碼塊、JavaScript程式碼塊、伺服器端程式碼……看看下面的程式碼。

<!--[if IE]> 
<script type="text/javascript"> 
 alert("你使用的是IE瀏覽器!"); 
</script> 
<![endif]--> 

相關文章