CSS引入方式以及<link>与@import区别

CSS引入方式

引入CSS的方式可分为以下3种：

1、内联样式（直接在标签中用style）

2、嵌入样式（在<style></style>标签）

3、外部链接样式

• <link rel=”stylesheet” href=”xxx.css”>标签
• <style>

             @import url( “xxx.css”) /* 也可以写成@import "xxx.css"  */

body{

font-size:14px;

}

           </style>）

注意：使用@import时，必须保证写在<style></style>的最前面,当然如果有@charset时除外

@import的用法请参见官网：http://www.w3.org/TR/CSS21/cascade.html

<link>和@import的区别

1、加载顺序不同：link引入的CSS加载会和html加载同时进行，而@import引入的CSS在html加载完成后再加载，所以会导致网页刚开始时加载时没有样式

2、兼容性不同：@import对老的IE5之前的浏览器不支持，link支持所有浏览器

3、DOM控制样式时，不能控制@import的样式，只能控制link引入的样式

4、@import引入的样式表中可以用@import再次引入子样式表