外部引用CSS中 link與@import的區(qū)別
發(fā)布時間:2009-11-19 21:03:06 作者:佚名
我要評論

看到淘寶網(wǎng)頁中這樣寫使用的是import,而很多網(wǎng)站都是使用link,當然還有一些頁面比較簡單,流量很大的網(wǎng)站,是直接將CSS寫在html代碼中的?他們有什么區(qū)別?
css用import還是link好?從經典論壇和另外一個網(wǎng)站大概了解了一下
看到淘寶網(wǎng)頁中大部分是這樣寫的
<style type="text/css" media="screen">
@import url("http://www.taobao.com/home/css/global/v2.0.css?t=20070518.css");
</style>
而很多網(wǎng)站,比如我的 http://chabaoo.cn/ 使用的都是link
<link rel="stylesheet" rev="stylesheet" href="default.css" type="text/css" media="all" />
而像google 百度 163等網(wǎng)站他們都是直接寫在網(wǎng)頁中
當然使用鏈接link和導入import的好處就是易于維護,但當網(wǎng)速比較慢的時候,會出現(xiàn)加載中斷的情況,導致頁面排版錯誤
他倆的作用相同
唯一的不同是服務對象不一樣
@import 為CSS服務
link是為當前的頁服務
經典有網(wǎng)友說 @import會優(yōu)先執(zhí)行。
外部引用CSS中 link與@import的區(qū)別
這兩天剛寫完XHTML加載CSS的幾種方式,其中外部引用CSS分為兩種方式link和@import。
本質上,這兩種方式都是為了加載CSS文件,但還是存在著細微的差別。
* 差別1:老祖宗的差別。link屬于XHTML標簽,而@import完全是CSS提供的一種方式。
link標簽除了可以加載CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性等,@import就只能加載CSS了。
* 差別2:加載順序的差別。當一個頁面被加載的時候(就是被瀏覽者瀏覽的時候),link引用的CSS會同時被加載,而@import引用的CSS 會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式(就是閃爍),網(wǎng)速慢的時候還挺明顯(夢之都加載CSS 的方式就是使用@import,我一邊下載一邊瀏覽夢之都網(wǎng)頁時,就會出現(xiàn)上述問題)。
* 差別3:兼容性的差別。由于@import是CSS2.1提出的所以老的瀏覽器不支持,@import只有在IE5以上的才能識別,而link標簽無此問題。
* 差別4:使用dom控制樣式時的差別。當使用javascript控制dom去改變樣式的時候,只能使用link標簽,因為@import不是dom可以控制的。
從上面的分析來看,還是使用link標簽比較好。
看到淘寶網(wǎng)頁中大部分是這樣寫的
<style type="text/css" media="screen">
@import url("http://www.taobao.com/home/css/global/v2.0.css?t=20070518.css");
</style>
而很多網(wǎng)站,比如我的 http://chabaoo.cn/ 使用的都是link
<link rel="stylesheet" rev="stylesheet" href="default.css" type="text/css" media="all" />
而像google 百度 163等網(wǎng)站他們都是直接寫在網(wǎng)頁中
當然使用鏈接link和導入import的好處就是易于維護,但當網(wǎng)速比較慢的時候,會出現(xiàn)加載中斷的情況,導致頁面排版錯誤
他倆的作用相同
唯一的不同是服務對象不一樣
@import 為CSS服務
link是為當前的頁服務
經典有網(wǎng)友說 @import會優(yōu)先執(zhí)行。
外部引用CSS中 link與@import的區(qū)別
這兩天剛寫完XHTML加載CSS的幾種方式,其中外部引用CSS分為兩種方式link和@import。
本質上,這兩種方式都是為了加載CSS文件,但還是存在著細微的差別。
* 差別1:老祖宗的差別。link屬于XHTML標簽,而@import完全是CSS提供的一種方式。
link標簽除了可以加載CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性等,@import就只能加載CSS了。
* 差別2:加載順序的差別。當一個頁面被加載的時候(就是被瀏覽者瀏覽的時候),link引用的CSS會同時被加載,而@import引用的CSS 會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式(就是閃爍),網(wǎng)速慢的時候還挺明顯(夢之都加載CSS 的方式就是使用@import,我一邊下載一邊瀏覽夢之都網(wǎng)頁時,就會出現(xiàn)上述問題)。
* 差別3:兼容性的差別。由于@import是CSS2.1提出的所以老的瀏覽器不支持,@import只有在IE5以上的才能識別,而link標簽無此問題。
* 差別4:使用dom控制樣式時的差別。當使用javascript控制dom去改變樣式的時候,只能使用link標簽,因為@import不是dom可以控制的。
從上面的分析來看,還是使用link標簽比較好。
相關文章
- 這篇文章主要介紹了css link與@import區(qū)別詳解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習2019-10-14
CSS中l(wèi)ink和@import的區(qū)別說明
link與@import這兩種方式都是為了加載CSS文件,但還是存在著細微的差別。下面腳本之家小編給大家介紹CSS中l(wèi)ink和@import的區(qū)別說明,感興趣的朋友一起看下吧2016-08-12css中l(wèi)ink和@import的區(qū)別分析詳解
本文章詳細的介紹了關于link和@import的區(qū)別,有需要了解的朋友可以參考一下本文章2012-03-31- 們知道在網(wǎng)頁中引用外部CSS有兩種方式,即:@import與link,我們也經常聽到有人說要使用link來引入CSS更好,但是你知道為什么嗎2009-06-26
- 網(wǎng)頁制作Webjx文章簡介:這兩天剛寫完XHTML加載CSS的幾種方式,其中外部引用CSS分為兩種方式link和@import。 有很多網(wǎng)頁中的CSS鏈接與引用是這樣寫的:2009-04-02
CSS兩種方式link和@import-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學網(wǎng)
看到淘寶網(wǎng)頁中大部分是這樣寫的 <style type="text/css" media="screen"> @import url("http://www.taobao.com/home/css/global/v2.0.2008-10-31css用import還是link的區(qū)別-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學網(wǎng)
看到淘寶網(wǎng)頁中這樣寫使用的是import,而很多網(wǎng)站都是使用link,當然還有一些頁面比較簡單,流量很大的網(wǎng)站,是直接將CSS寫在html代碼中的?他們有什么區(qū)別?css用impor2008-10-17- CSS的link和@import都是用于引入外部CSS文件的方法,但它們有一些區(qū)別和不同的用法,本文通過一個簡單的代碼演示,展示了link和@import的用法,感興趣的朋友跟隨小編一起看2023-05-04