link 和 @import 的区别( link 属于 XHTML 标签,而 @import 是 CSS 提供的)
1. 引用的方式不同:
link(外部引用): <link rel="stylesheet" href="xxx.css" type="text/css" />
@import(导入式): @import url(xxx.css);
2. 放置的位置不同:link 一般放在 head 标签中,而 @import 必须放在 <style type="text/css"> 标签中。
3. 加载方式不同:link 会和 dom 结构一同加载渲染,而 @import 只能等 dom 结构加载完成以后才能加载渲染页面。
4. 兼容性不同:@import 只能在 IE6 以上才能识别,而 link 是 XHTML 标签,无兼容问题。
5. 样式权重不同:link 方式的样式的权重高于 @import。
6. 改变样式:link 支持使用 JavaScript 改变样式,而 @import 不可以。
7. 加载内容不同:link 除了可以加载 css 文件以外,还可以加载 MIME 类型的文件;而 @import 只能加载 css 文件。
参考:
扫描二维码关注公众号,回复:
6542366 查看本文章
END