CSS中 link與@import

外部引用CSS中 link與@import的區別:

link屬于XHTML標簽,而@import完全是CSS自己提供的一個語法。

1.加載內容。

link標簽除了可以加載CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性等,@import就只能加載CSS了。

2.加載順序的差別。

當一個頁面被加載的時候(就是被瀏覽者瀏覽的時候),link引用的CSS會同時被加載,而@import引用的CSS 會等到頁面全部被下載完再被加載。

所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式(就是閃爍),網速慢的時候更明顯。

3.兼容性的差別。

由于@import是CSS2.1里提出的,所以老的瀏覽器不支持,@import只有在IE5以上的才能識別。而link標簽無此問題。

4.使用dom控制樣式時的差別。

當使用javascript控制dom去改變樣式的時候,只能使用link標簽,因為@import不是dom可以控制的。

@import可以在css中再次引入其他樣式表。比如可以創建一個主樣式表,在主樣式表中再引入其他的樣式表,比如:

main.css

@import “sub1.css”;
@import “sub2.css”;
sub1.css

p {color:red;}
sub2.css

.myclass {color:blue}

這樣更利于修改和擴展。但同時這樣做有一個缺點,會對網站服務器產生過多的HTTP請求,以前是一個文件,而現在卻是兩個或更多文件 了,服務器的壓力增大,瀏覽量大的網站還是謹慎使用。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,815評論 1 92
  • 轉載請聲明 原文鏈接地址 關注公眾號獲取更多資訊 第一部分 HTML 第一章 職業規劃和前景 職業方向規劃定位...
    前端進階之旅閱讀 16,627評論 32 459
  • 一、css是什么? CSS全稱是Cascading Style Sheets,簡寫為CSS,稱作:層疊樣式表,又稱...
    青鳴閱讀 889評論 0 1
  • 最近在看html基礎,好吧,寫點筆記,比較low見諒,反正我自己看懂就行了 CSS基礎 1、css簡介 casca...
    小龍是只貓閱讀 603評論 0 1
  • 今天的表演課上很榮興能扮演big wired這一角色。感覺自己發揮,將就吧,因為沒我平時錄音的時候那么流暢自然。...
    meanyo閱讀 138評論 0 0