欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

IE 條件注釋詳解總結(附實例代碼)

 更新時間:2009年08月29日 15:26:49   作者:  
IE的有條件注釋是一種專有的(因此是非標準的)、對常規(guī)(X)HTML注釋的Miscrosoft擴展。
顧名思義,有條件注釋使你能夠根據(jù)條件(比如瀏覽器版本)顯示代碼塊。盡管是非標準的,但是有條件注釋對于其他所有瀏覽器作為常規(guī)注釋出現(xiàn),因此本質上是無害的。有條件注釋在Windows上的IE5中首次出現(xiàn),并且得到了Widnows瀏覽器所有后續(xù)版本的支持。

IE的有條件注釋及其有效,而且非常容易記住。主要的缺點是這些注釋需要放在HTML頁面中,而不是放在CSS中。這樣,當你不需要這些東西,或者有所更改的時候,就需要維護很多的地方。

讓我們據(jù)幾個例子來看看吧——

只有IE才能識別
因為只有IE5以上的版本才開始支持IE條件注釋,所有“只有IE”才能識別的意思是“只有IE5版本以上”才能識別。
復制代碼 代碼如下:

<!--[if IE]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

只有特定版本才能識別
例如,只有IE5才能識別,只有IE6才能識別,只有IE7或者IE8才能識別。識別的條件是特定的版本,高了或者低了都不可以。例如下面的代碼塊,將只會在IE8中有效
復制代碼 代碼如下:

<!--[if IE 8]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->
 
IE共存 
只有不是特定版本的才能識別
當然,IE瀏覽器需要在5以上的版本,才在討論范圍之內。例如下面的例子中,特定了IE7版本不能識別。
復制代碼 代碼如下:

<!--[if !IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->
 
IE共存 
只有高于特定版本才能識別
只有高于制定版本的IE瀏覽器才能識別的代碼塊。
復制代碼 代碼如下:

<!--[if gt IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

有朋友會問,為什么IE7沒有應用到效果呢?那是因為IE7等于IE7,而不是高于IE7。所有IE7也沒有起效果。
等于或者高于特定版本才能識別
復制代碼 代碼如下:

<!--[if gte IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

IE共存 
只有低于特定版本的才能識別
復制代碼 代碼如下:

<!--[if lt IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

IE共存 
等于或者低于特定版本的才能識別
復制代碼 代碼如下:

<!--[if lte IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

IE共存 
關鍵詞解釋
上面那些代碼好像很難記的樣子,其實只要稍微解釋一下關鍵字就很容易記住了。
lt :就是Less than的簡寫,也就是小于的意思。
lte :就是Less than or equal to的簡寫,也就是小于或等于的意思。
gt :就是Greater than的簡寫,也就是大于的意思。
gte:就是Greater than or equal to的簡寫,也就是大于或等于的意思。
!:就是不等于的意思,跟javascript里的不等于判斷符相同。
這樣解釋一下,是不是好記多了。
關于IE條件注釋的特別說明
只有IE才能識別哦——
曾經看到過下面的代碼,現(xiàn)在想起來不禁有點想笑。這樣的代碼有什么意義嗎?
復制代碼 代碼如下:

<!--[if !IE]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

不僅僅是CSS哦
很長時間,我對這個都有一種誤解——以為它就是用來根據(jù)瀏覽器不同載入不同css,從而解決樣式兼容性問題的。其實,我錯了。它其實可以做的更多。它可以保護任何代碼塊——HTML代碼塊、JavaScript代碼塊、服務器端代碼……看看下面的代碼。
復制代碼 代碼如下:

<!--[if IE]>
你使用的是IE瀏覽器,還會彈出個框哦。
<script type="text/javascript">
alert("你使用的是IE瀏覽器!");
</script>
<![endif]-->

相關文章

  • js實現(xiàn)隨屏幕滾動的帶緩沖效果的右下角廣告代碼

    js實現(xiàn)隨屏幕滾動的帶緩沖效果的右下角廣告代碼

    這篇文章主要介紹了js實現(xiàn)隨屏幕滾動的帶緩沖效果的右下角廣告代碼,涉及javascript基于數(shù)學運算及定時函數(shù)動態(tài)操作頁面元素的實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-09-09
  • js實現(xiàn)窗口全屏示例詳解

    js實現(xiàn)窗口全屏示例詳解

    這篇文章主要為大家詳細介紹了js實現(xiàn)窗口全屏示例,包含全屏事件、退出全屏事件等,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2019-09-09
  • 用js代碼和插件實現(xiàn)wordpress雪花飄落效果的四種方法

    用js代碼和插件實現(xiàn)wordpress雪花飄落效果的四種方法

    這篇文章主要介紹了用js代碼和插件實現(xiàn)wordpress雪花飄落效果的四種方法,需要的朋友可以參考下
    2014-12-12
  • element el-input 刪除邊框的實現(xiàn)

    element el-input 刪除邊框的實現(xiàn)

    本文主要介紹了element el-input 刪除邊框的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2023-04-04
  • JS面向對象之單選框實現(xiàn)

    JS面向對象之單選框實現(xiàn)

    這篇文章主要為大家詳細介紹了JS面向對象之單選框實現(xiàn),文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-01-01
  • Bootstrap選項卡學習筆記分享

    Bootstrap選項卡學習筆記分享

    這篇文章主要為大家詳細介紹了Bootstrap選項卡學習筆記,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-02-02
  • js使用child_process模塊操作cmd命令

    js使用child_process模塊操作cmd命令

    這篇文章主要給大家介紹了關于js使用child_process模塊操作cmd命令的相關資料,在JavaScript中執(zhí)行CMD命令非常靈活,可以執(zhí)行任何CMD命令,例如:復制、移動、刪除文件等等,需要的朋友可以參考下
    2024-01-01
  • Bootstrap 中data-[*] 屬性的整理

    Bootstrap 中data-[*] 屬性的整理

    本文給大家收藏整理了關于Bootstrap 中data-[*] 屬性的相關知識,感興趣的朋友一起看看吧
    2018-03-03
  • 微信小程序實戰(zhàn)之自定義toast(6)

    微信小程序實戰(zhàn)之自定義toast(6)

    這篇文章主要為大家詳細介紹了微信小程序實戰(zhàn)之自定義toast的相關方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-04-04
  • JavaScript中的FileReader圖片預覽上傳功能實現(xiàn)代碼

    JavaScript中的FileReader圖片預覽上傳功能實現(xiàn)代碼

    本文通過實例代碼給大家介紹了js中的FileReader圖片預覽上傳功能,代碼分為html和js代碼兩部分,具體實現(xiàn)代碼大家參考下本文
    2017-07-07

最新評論