\@import和link的区别

css 卷

html&css

发布日期: 2021-01-13

文章字数: 249

阅读时长: 1 分

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="sty1.css">
    <style>
        @import url('sty2.css');
    </style>
    <!-- link和import都可以引入样式
1.1、link属于html标签，而@import是css提供的。
1.2、页面被加载时，link会同时被加载，而@import引用的css会等到页面被加载完再加载的。
1.3、兼容性问题：@import只在IE5以上才能识别，而link是html标签，无兼容性问题。（@import css2才出来）
1.4、DOM操作:DOM可以操作link中的样式，而不可以操作@import中的样式。(理由是第一点)
    -->
</head>
<body>
    <div style="height: 20px;">

    </div>
    <p  style="height: 20px;">

    </p>
    <script>
        var val1=1;
        var val2=1;

        var num1={
            a:2,
        };
        var num2={
            a:2
        };
        //console.log(val1===val2);//引用值1true
        //console.log(num1===num2);//引用地址false
        //console.log(num1.a===num2.a);//true
        //console.log(document.getElementsByTagNameNS()); xml的API
    </script>
</body>
</html>