link與@import引入css檔案差別

頁面導入外部css檔案的方法通常有兩種，一種在網頁中直接link标簽加入，另一種在頁面中@import引入css檔案。兩種引入形式如下：

引入形式：

兩者差别：

1 适用範圍不同

@import可以在網頁頁面中使用，也可以在css檔案中使用，用來将多個css檔案引入到一個css檔案中；而link隻能将css檔案引入到網頁頁面中。

2 功能範圍不同

link屬于XHTML标簽，而@import是CSS提供的一種方式，link标簽除了可以加載CSS外，還可以定義rel連接配接屬性，定義RSS等，@import就隻能加載CSS。

3 加載順序不同

頁面被加載的時候，link引用的CSS會同時被加載，而@import引用的CSS會等到頁面全部被下載下傳完再被加載。是以有時候浏覽@import加載CSS的頁面時開始會沒有樣式（就是閃爍）。

4 相容性

由于@import是css2.1提出的，是以老的浏覽器不支援，@import隻有在IE5以上的才能識别，而link标簽無此問題。

5 控制樣式時的差别

使用link方式可以讓使用者切換CSS樣式.現代浏覽器如Firefox,Opera,Safari都支援rel=”alternate stylesheet”屬性(即可在浏覽器上選擇不同的風格),當然你還可以使用Javascript使得IE也支援使用者更換樣式。

6 使用DOM控制樣式時的差别

當使用JavaScript控制DOM去改變樣式的時候，隻能使用link标簽，因為@import不是DOM可以控制的。