在群里面有人提出link和@import的区别,细想一下,我还真不知道,于是乎google了一下，记录于此。
?
首先展示一下二者的写法
?
??? 大部分网站采用的link方式：
???
<link rel="stylesheet" href="style.css" type="text/css" media="all" />
?
??? @import 方式
<style type="text/css" media="screen">
@import url("style.css");
</style>
?二者均是为了加载css文件，但有如下几个小小的差别：
?
1. 本质区别：
link是为当前页服务，属于XHTML标签，除了可以加载CSS外，还可以做很多其它的事情，比如定义RSS，定义rel连接属性
@import是为css服务，是属于css的一种方式，只能用来引入css
2. 加载顺序:
当一个页面被加载的时候，link引用的CSS会同时被加载，而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式，页面会出现闪烁。
3.兼容性:
link所有浏览器均可以兼容
@import是css2.1才提出来的，所有一些老的浏览器不支持，只有IE5以上的才能识别。
4. 使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。