link和 import的用法及區別

2021-10-16 04:58:15 字數 1222 閱讀 3888

本質上,這兩種方式都是為了載入css檔案,但還是存在細微的差別。

1、從屬關係區別

@import是 css 提供的語法規則,只有匯入樣式表的作用;link是html提供的標籤,不僅可以載入 css 檔案,還可以定義 rss、rel 連線屬性等。

2、載入順序區別

載入頁面時,link標籤引入的 css 被同時載入;@import引入的 css 將在頁面載入完畢後被載入。

3、相容性區別

@import是 css2.1 才有的語法,故只可在 ie5+ 才能識別;link標籤作為 html 元素,不存在相容性問題。

4、dom可控性區別

可以通過 js 操作 dom ,插入link標籤來改變樣式;由於 dom 方法是基於文件的,無法使用@import的方式插入樣式。

<

!-- link是標籤,引入外部樣式表 --

>

"stylesheet" href=

"./a.css"

>

/* @import 在css環境中 匯入外部css */

@import url

('./b.css');

.box

<

/style>

<

/head>

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

@import 「sub1.css」;

@import 「sub2.css」;

sub1.css

———————-

p sub2.css

———————-

.myclass

這樣有利於修改和擴充套件。

css 權重優先順序順序簡單表示為:

!important>行內樣式>id>類、偽類、屬性>標籤名>繼承>萬用字元

link和 import的區別

在html中有4種方式引入css 1.內聯方式 div 2.嵌入方式 content style 3.link鏈結 4.import匯入 import url style.css style link和 import兩種都是外部引用css的方式,然而這兩者也存在一定差別 1 link屬於xhtml標...

link和import的區別

1,本質區別 link是html的乙個標籤,除了匯入css檔案外,還可以定義其他事物,而import是css的法則,只供給css載入檔案 2,dom dom可以控制文件中的所有元素,可以插入link修改樣式,不可以操作import 3,權重優先順序 link的修改樣式的優先順序高於import 4,...

link和 import的區別

1.從屬關係區別 import是 css 提供的語法規則,只有匯入樣式表的作用 link是html提供的標籤,不僅可以載入 css 檔案,還可以定義rss rel 連線屬性等。2.載入順序區別 載入頁面時,link標籤引入的 css 被同時載入 import引入的 css 將在頁面載入完畢後被載入。...