1. 程式人生 > >@import匯入外部樣式表與link鏈入外部樣式表的區別

@import匯入外部樣式表與link鏈入外部樣式表的區別

1:老祖宗的差別。link屬於XHTML標籤,而@import完全是CSS提供的一種方式。 link標籤除了可以載入CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連線屬性,等,@import就只能載入CSS了。 2:載入時間及順序不同。使用link連結的css是客戶端瀏覽你的網頁時先將外部的CSS檔案載入到網頁當中,然後再進行編譯顯示,所以這種情況下顯示出來的網頁跟我們預期的效果一樣,即使一個頁面link多個css檔案,網速再慢也是一樣的效果;而使用@import匯入的CSS就不同了,客戶端在瀏覽網頁時是先將html的結構呈現出來,再把外部的CSS檔案載入到網頁當中,當然最終的效果也是跟前者是一樣的,只是當網速較慢時會出現先顯示沒有CSS統一佈局時的html網頁,這樣就會給閱讀者很不好的感覺。這也是現在大部分網站的CSS都採用連結方式的最主要原因。 3:相容性不同。由於@import是CSS2.1提出的所以老的瀏覽器不支援,@import只有在IE5以上的才能識別,而link標籤無此問題。 4:使用dom控制樣式時出現問題。當使用javascript控制dom去改變樣式的時候,只能使用link標籤,因為@import不是dom可以控制的。