link和@import的区别

应用场景:

<head>
    <!-- link是标签,引入外部样式表 -->
    <link rel="stylesheet" href="./a.css">
    <style>
        /* @import 在css环境中 导入外部css */
        @import url('./b.css');
        .box{
          width: 100px;
          height: 100px;
          background: green;
        }
    </style>
</head>

区别:
1、link属于标签,@import在css中使用表示导入外部样式表;
2、页面被加载时,link会同时被加载出来,而@import会等到页面被加载完成后才被加载;
3、@import只在IE5以上才能识别,link属于HTML标签,没有兼容问题;
4、link方式的样式权重高于@import的权重;
5、link支持使用JavaScript改变样式(document.styleSheets),后者不可以

相关推荐
©️2020 CSDN 皮肤主题: 精致技术 设计师:CSDN官方博客 返回首页