link和@import的区别

目录

1. 讲解：

2. link

3. @import

4. 区别：

5. link和@impor的详细区别

    1. 从属关系

    2. 加载顺序

    3. 兼容性问题

    4. DOM可控性

    5. 权重问题（有争议）

---

1. 讲解：

页面中使用CSS的方式主要有3种：

行内添加定义style属性值，页面头部内嵌调用和外面链接调用，其中外部引用有两种分别是：link和@import。

2. link

<link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" />

3. @import

<style type="text/css" media="screen"> 
    @import url("CSS文件"); 
</style> 

4. 区别：

link属于html标签。@import在css中使用表示导入外部样式表；
页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;
import只在IE5以上才能识别，而link是HTML标签，无兼容问题;
link方式的样式的权重 高于@import的权重；
link 支持使用javascript