【JS提升】link与@import引入CSS样式表的区别一、link与@import引入CSS样式表的区别

66 阅读 0 评论 44 点赞

我是靠谱客的博主健康天空，最近开发中收集的这篇文章主要介绍【JS提升】link与@import引入CSS样式表的区别一、link与@import引入CSS样式表的区别，觉得挺不错的，现在分享给大家，希望可以做个参考。

一、link与@import引入CSS样式表的区别

link与@import都常用来引入css样式表

1、从属关系不同：link-html标签, 可以定义RSS, rel关联属性设置
@import-CSS关键字, 只能引入样式表文件

2、加载顺序不同
link 引入CSS是同时加载的，异步加载不阻塞
@import 页面加载完毕后被加载

3、兼容性：
link 不存在兼容问题
@import css2.1 IE5以上才能兼容

4、DOM操作
link是可以通过DOM进行操作的
@import 不行

5、“link 引入的样式权重大于@import引入的样式” 这种说法对吗？不对，和权重无关
@import引入的样式会放在最上面，所以link的样式会覆盖掉import的样式

@import url('style.css');
/* 引入后就放在这里
html {
background-color: green;
}
*/
html {
height: 100%;
background-color: red;
}

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。