link和@import区别

文章目录[隐藏]

• Link 和@import 的区别
• 补充： css 几种加载方式

Link 和@import 的区别

1. link 属于 XHTML 标签，而@import 属于 css 提供的语法规则；
2. link 在页面加载时同时加载，而@import 是在页面全部加载完成后加载；
3. link 可以通过js动态加载，而@import 不可以动态加载；
4. link 无兼容性差别，而@import 仅支持 ie5 以上；
5. @import 必须包裹在 style 标签中，如：<style>@import url(main.css)</style>

补充： css 几种加载方式

1. 内联样式
   栗子：<div style="h1{color:red;}"></div>
2. 嵌入样式
   栗子：

   h1{
     color: red;
   }

3. 链接引入
   栗子：

   <link rel="stylesheet"; type="text/css"; href="main.css" />;

4. 导入样式

栗子：

<style>
          @import url(main.css);
      </style>