自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

CSS中l(wèi)ink和import的區(qū)別

開發(fā) 前端
你對CSS中l(wèi)ink和import方式的用法和區(qū)別是否比較熟悉,這里和大家分享一下,它們兩者的作用相同,唯一的不同是服務對象不一樣,@import為CSS服務,而link是為當前的頁服務。

本文向大家描述一下CSS中l(wèi)ink和import方式的分析與比較,重點說一下外部引用CSS中l(wèi)ink與@import的區(qū)別,本質上,這兩種方式都是為了加載CSS文件,但還是存在著細微的差別,請看本文詳細介紹。

CSS中l(wèi)ink和import方式的分析與比較

有很多網(wǎng)頁中的CSS鏈接與引用是這樣寫的:

  1. <styletypestyletype="text/css"media="screen"> 
  2. @importurl("http://www.52css.com/abc.css");  
  3. </style> 

 而很多網(wǎng)站使用的都是link

ExampleSourceCode

  1. <linkrellinkrel="stylesheet"rev="stylesheet"  
  2. href="52CSS.com"type="text/css"media="all"/> 
  3.  

  而像google百度163等網(wǎng)站他們都是直接寫在網(wǎng)頁中,當然使用鏈接link和導入import的好處就是易于維護,但當網(wǎng)速比較慢的時候,會出現(xiàn)加載中斷的情況,導致頁面排版錯誤。他倆的作用相同,唯一的不同是服務對象不一樣:

       @import為CSS服務

  link是為當前的頁服務

外部引用CSS中l(wèi)ink與@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標簽比較好。
 

【編輯推薦】

  1. CSS在IE和Firefox中常見問題及解決方案
  2. 三種實用CSS清除浮動方法揭秘
  3. 專家推薦三大“***”CSS技巧!
  4. 編寫***CSS代碼的五個關鍵
  5. CSS水平居中和垂直居中多種解決方案

  
 

 

責任編輯:佚名 來源: 52css.com
相關推薦

2010-09-08 09:33:09

CSSlink@import

2010-09-13 16:38:53

CSSlink@import

2010-08-30 10:32:38

SPANDIV

2010-09-13 13:01:34

CSSpxem

2010-09-08 17:11:29

CSS塊元素CSS內聯(lián)元素

2010-09-06 16:27:06

CSSabsoluterelative

2010-09-09 14:16:24

pxemCSS

2010-09-14 13:05:10

VisibilityDisplayCSS DIV

2010-09-09 15:17:01

absoluterelativeCSS

2010-09-09 15:54:00

blockinlineCSS

2010-08-23 13:45:28

padding-botCSSpadding-rig

2010-08-20 15:56:58

padding-toppadding-lefCSS

2010-08-23 13:21:51

padding-lefpadding-rigCSS

2010-09-10 11:32:23

CSS絕對定位CSS相對定位

2010-09-07 16:21:37

CSSDisplayVisibility

2020-11-18 09:06:02

JavaScript開發(fā)技術

2010-08-20 14:11:26

IE火狐瀏覽器

2010-09-16 10:29:47

DisplayVisibilityCSS

2013-02-22 13:14:06

WebCSS2.1CSS3+

2010-08-30 10:52:39

CSSclassid
點贊
收藏

51CTO技術棧公眾號