向HTML文档中引入CSS常见有四种方法：
1. <link>标签：
<link rel="stylesheet" type="text/css" href="sheet1.css" media="all"/ title="" />
自封闭标签，写在<head>元素中。
- rel：关系
- type：类型
- href：需要链接的文件路径
- media：表现媒体
| media的值 | 含义 |
|---|---|
| all | 所有媒体 |
| 打印文档时，包括打印预览 | |
| screen | 屏幕媒体 |
| aural | 语音媒体（语音合成器、屏幕阅读器等） |
2. @import 指令：
<style type="text/css">
@import url(styles.css);
...
</style>
放在style容器中，用于加载一个外部样式表，必须放在其他CSS规则之前。不同于link出现多条会覆盖，而是当有多条@import指令时会全部加载，合并使用。
3. 内部CSS样式
<style type="text/css">
body {
background: white;
color: gray;
}
</style>
style容器常放在head里，style容器中的代码直接使用CSS语法。
4. 内联CSS样式
<h1 style="color:blue;margin-left:30px;">This is a heading</h1>
将样式规则直接写在标签的style属性里。这种写法的CSS拥有最高优先级，但这种写法一方面会使得页面代码混乱，不便于阅读与后期维护，另一方面会损失掉CSS可以对多个元素统一管理样式的优势，所以不建议使用。
网友评论