跳轉到內容

超文字標記語言/條件註釋

來自 Wikibooks,開放世界中的開放書籍

條件註釋是微軟 Windows 版 Internet Explorer (IE/win) 4.0 及更高版本對 HTML 的私有擴充套件。Mac 版 Internet Explorer (IE/mac) 中不提供此功能。它們是處理 Internet Explorer 各個版本中 CSS 錯誤的一種非常有用的方法。

普通 (X)HTML 註釋如下所示

<!-- This text will be ignored by the browser. -->

條件註釋在註釋中添加了額外的語法。最簡單的示例是

<!--[if IE]> This text will be shown by IE/win ver. 5.0 and higher. <![endif]-->

不理解條件註釋語法的瀏覽器會將其視為普通註釋處理,即註釋內容將被忽略。

可以透過更改 if 後面的表示式來定位 IE/win 的特定版本。例如,要定位主版本號為 5 的任何 IE/win 版本,請使用
<!--[if IE 5]> 此瀏覽器的主要版本號為 5。 <![endif]-->
文字將在 IE/win 5.0 和 5.5 版本中顯示。

要定位特定的版本號,例如 5.0,語法略有不同。

  • <!--[if IE 5.0]> 您正在使用 IE/win 5.0。 <![endif]-->
  • <!--[if IE 5.5000]> 您正在使用 IE/win 5.5。 <![endif]-->
  • <!--[if IE 6.0]> 您正在使用 IE/win 6.0。 <![endif]-->

可以透過在 IE 之前放置運算子來在表示式中使用不等式。運算子為

lt
小於(但至少為 5.0 版,這是支援條件註釋的最低版本)
lte
小於或等於(但至少為 5.0 版,這是支援條件註釋的最低版本)
gt
大於
gte
大於或等於

示例
<!--[if gte IE 6]> IE/win 6.0 及更高版本將顯示此文字。 <![endif]-->

所有表示式都可以透過在前面加上 ! 來取反,例如
<!--[if !gte IE 6]> 支援條件註釋的低於 6 版的 IE/win 版本將顯示此文字。 <![endif]-->


<!--[if !IE]> 任何理解條件註釋的 IE/win 版本都不會顯示此文字。其他任何瀏覽器也不會顯示它,因為它們會將其視為普通註釋。 <![endif]-->

第二個示例可能看起來毫無意義,但只需稍加修改,就可以安排隱藏 5 版及更高版本的 IE/win 中的文字。
<!--[if !IE]>--> 任何理解條件註釋的 IE/win 版本都不會顯示此文字。其他瀏覽器將顯示它,因為它們會將其視為夾在兩個普通註釋之間的文字。 <!--<![endif]-->

以下 HTML 文件是一個工作示例。

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Conditional comments</title>
  </head>
  <body>
    <!--[if !IE]>-->
      <p>This is page is not being viewed with Internet Explorer for Windows version 5.0 or higher.</p>
    <!--<![endif]-->
    <!--[if IE]>
      <p>This is page is being viewed with Internet Explorer for Windows version 5.0 or higher.</p>
    <![endif]-->
  </body>
</html>

與 CSS 結合使用

[編輯 | 編輯原始碼]

條件註釋可用於向 IE/win 傳遞其他樣式表。這些樣式表可以修復 IE/win 中的佈局錯誤。基本思想是

  <head>
    <title>Conditional comments</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <!--[if IE 5]>
    <link rel="stylesheet" type="text/css" href="bugFixForIE5x.css">
    <![endif]-->
  </head>
[編輯 | 編輯原始碼]

這些 條件註釋測試(位於 Position is Everything 網站)可能有助於您理解條件註釋的特性。

華夏公益教科書