2013/01/07

@import 第二頁

@import 2

輸入風格表的檔案,其語法是:

@import 外部風格檔案 媒體型態集;

以下範例均在個人電腦測試成功,因為部落格無法上傳 css 檔案,所以無法顯示效果。

使用多組 STYLE 區塊。由於 @import 必須在所有規則之前,可以用多組 STYLE 區塊,將風格表分開,以確保 @import 是在所有風格規則之前。下例將風格表分成兩份。如果是風格檔案,也可以將其分成兩個檔,依序讀入。

執行範例:

  • 上例在 IE6, Firefox, Safari, Chrome 測試成功。
  • test.css 的內容:

可以指定媒體

  • IE6 失敗;Firefox, Safari, Chrome 成功。

CSS hack:IE7(及以下版本)沒有支援後接媒體型態的語法;所以被設計師用來分別不同的瀏覽器。下面的範例依循兩個原則:(一)後宣告的值會蓋過先宣告的值。(二)解讀失敗的宣告會被忽略。

  • 測試時發現一個現象,由於上面兩個風格檔被拿掉,因此 @import 讀不到檔案;在 Safari, Chrome 造成 P 元素 右移了三個字的寬度;IE6, Firefox 則正常。
@import(你正在看 第二頁) : 第一頁 第二頁