行内样式表
理解:在元素标签内部的style属性中设定CSS样式。适合于修改简单样式。
示例:
<h1 style="color: mediumturquoise; font-weight: 200;">走近苏州</h1>
注意:
- 在双引号中,写法要符合CSS的语法规范
- 可以控制当前标签的属性
- 书写较繁琐,不推荐大量使用
内部样式表【嵌入式引入】
理解:在HTML页面内部写样式,但是单独放在<style></style>
标签内部
示例:
<style>
h1{font:italic 700 16px 'Microsoft Yahei';}
</style>
注意:
<style></style>
标签可以放在HTML页面的任何位置,但一般放在<head></head>
标签里- 内部样式表可以控制整个页面的元素的样式
- 代码结构清晰,但是没有实现结构和样式分离
外部样式表
理解:将样式全部写到CSS文件,再将文件导入HTML页面
注意:
- CSS文件里只有样式,没有
<style></style>
标签 - CSS文件后缀名为.css
- 在HTML文件中使用
<link>
标签引入该文件,书写格式如下
<link rel="stylesheeet" href="css文件路径">