link和@import都是引入外部CSS样式的方法
link是链接法,@import是导入法
link与@import的区别
- link属于html标签,没有兼容性;@import是CSS提供的,IE5以上才能识别
- 使用link,是一边加载页面一边加载引入的CSS样式,体验良好;而@import则是加载完页面,再逐渐加载引入的样式。
- link的优先级高于@import
- link除了加载CSS文件,还可以引入图标icon或别的一些文档信息;而@import只能用于引入样式表。
- link支持使用JavaScript控制DOM从而改变样式;@import则不支持
关于第四点提到了的ink除了加载外部样式表,还可以引入图标icon等,我们则需要了解一下link标签的具体属性:
可以查看文章:link标签详解
主要关注的是:
- 作用:link标签用于定义文档与外部资源的关系。
- 类型:link标签是空元素
- 位置:只能使用在head部分
- 次数:可以使用多次
还有其三个主要属性:
- type:定义被链接文档的MIME类型
- rel:定义当前文档和被链接文档之间的联系
- href:定义被链接文档的位置
rel可以设置不同的值,最常见就是styleSheet,即被链接文档是外部样式表的意思。那rel如果取其它值,意味着被连接文档与文档则是别一种的关系,也就是可以引入除了外部样式表的其它外部资源。所以link除了引入外部样式表,还可以做别的用途!