我們都知道在html中引入外部的CSS 有2種方式，link標簽和@import，他們又什么區別呢？
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的方式插入樣式。
5.權重區別(該項有爭議，下文將詳解)
link引入的樣式權重大於@import引入的樣式。
補充說明：
@import的書寫方式
1 <style type="text/css"> 2 @import 'style.css' //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不識別 3 @import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不識別 4 @import url(style.css) //Windows NS4, Macintosh NS4不識別 5 @import url('style.css') //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不識別 6 @import url("style.css") //Windows NS4, Macintosh NS4不識別 7 </style>
熊貓辦公https://www.wode007.com/sites/73654.html
其中，@import url(style.css) 和@import url("style.css")是最優的選擇，兼容的瀏覽器最多。從字節優化的角度來看@import url(style.css)最值得推薦。
link的書寫方式
<link href="style.css" rel="stylesheet" type="text/css"> 另外link還有其他的一些用途，比如引入圖標
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
總結
總體來說：link優於@import，強烈建議使用link標簽，慎用@import方式。