CSS介绍与书写位置
1. CSS是什么
CSS是Cascading Style Sheet的缩写，中文意思为"层叠样式表"，它是网页的装饰者，用来修饰各标签排版（大小、边距、背景、位置等）、改变字体的样式（字体大小、字体颜色、对齐方式等）、设置图片（宽高、位置等）等。
2. CSS书写位置
css代码分为内部样式、外部样式、行内样式三种写法。
2.1 行内样式
借助了所有标签都有的属性style，为当前的元素添加样式声明。
<标签名 style="样式声明">
CSS样式声明: 由CSS属性和值组成
- CSS属性：你希望给HTML标签设置的样式名字
- 值：使用值来控制某个属性显示的效果
style="css属性名:值;css属性名:值;"
2.2 内嵌样式
借助于style标签，在HTML文档中嵌入CSS样式代码，可以实现CSS样式与HTML标签之间的分离。同时需借助于CSS选择器到HTML 中匹配元素并应用样式。
选择器：在HTML页面当中找到元素
<style>
选择器{
css属性名:值;
css属性名:值;
}
</style>
2.3 外链样式表
创建外部样式表文件 后缀使用.css，在HTML文件中使用<link>标签引入外部样式表
<!-- rel：引入文件资源类型 href：引入文件资源的路径 -->
<link rel="stylesheet" href="外部样式表的地址">
2.4 三种方式比较
| 样式表 | 优点 | 缺点 | 使用情况 | 使用场景 |
|---|---|---|---|---|
| 行内样式表 | 书写方便，权重高 | 没有实现结构与样式分离，不便于维护，不可以重复利用 | 极少 | 某个标签需要单独的样式设置时使用 |
| 内嵌样式表 | 部分结构与样式分离，较便于维护 | 没有彻底实现结构与样式分离，不可以重复利用 | 一般 | css代码量不多，且和当前页面联系紧密不需要复用时使用 |
| 外链样式表 | 完全实现结构与样式分离，可重复利用 | 如果代码量较少情况下，引入法更麻烦 | 最多，推荐 | css代码量大时，或者需要重复利用时使用 |
