link引用样式与@import

1、@import 必须放在css文件的顶部，否则不会被浏览器加载；

2、在外部的css文件中使用@import会使页面在加载时增阿基额外的延迟；

3、虽然规则允许在css文件中使用@import引用外部的样式，但是浏览器不能并行下载，会使页面增加额外的往返耗时；

 

假如，在第一个css文件first.css文件中使用了 @import url('second.css'), 那么浏览器就必须先把first.css文件下载、解析和执行后，发现需要处理second.css，然后才会去下载并解析second.css ;

所以，好的方式是使用link方式代替@import 方式。

 

link 与 @import的区别：

1、老祖宗的差别： link是属于XHTML标签，而@import则是css提供的一种引用样式的方式； link标签除了引用css文件外，还可以做其他很多事情，像指定RSS，定义rel连接属性，而@impoer只能加载样式文件；

2、加载顺序的差别：当一个网页被加载的时候，link引用的文件会被同时并行下载，而@import引用的css文件在页面全部加载完成后才会被下载；

3、兼容性问题：@import是css2.1提供的，所以老的浏览器不支持；

 

link 与 @import 都可以通过js的方式嵌入到页面中;