link
1 2 3
@import
1
区别
link是先将css文件加载到网页,然后再进行编译。@import是先加载完html结构再加载css文件,如果网速较慢则会影响视觉效果。
link确保并行下载css文件,@import是一个一个下载。
在IE中,link会阻断@import延长加载时间,多个@import的使用还会打乱资源文件的下载顺序引发js问题。
选择
link可以选定要加载的媒体media。由于上述加载、兼容与IE的原因,普通站点应当尽量使用link。
大型门户网站(如淘宝)多个页面link同一个css文件会造成速度下降,@import可以在css中调入样式表,方便对css进行模块化管理。
参考资料:
高性能网站设计:不要使用@import
[讨论]@import调用样式表的优势是什么呢?
@import导入外部样式表与link链入外部样式表的区别