1.CSS规则集
CSS规则集由选择器和声明块构成，一条声明由属性和属性块构成，声明之间用分号隔开。
2.CSS的引入(CSS样式)
分类
- 内联样式：行内样式失去了样式表的许多优点（通过将内容与呈现混合在一起）。
- 内部样式
- 外部样式
- 链接式：属性rel和href是必要的
<link type="text/css" rel="styleSheet" href="CSS文件路径" />
- 导入式：
<style type="text/css"> @import url("css文件路径"); </style>
样式权重
- 行内样式（在 HTML 元素中）
- 外部和内部样式表（在 head 部分）
- 浏览器默认样式
本质
- 就近原则：如果多个样式表中为同一选择器（元素）定义了一些属性，则将使用最后读取的样式表中的值。
- 叠加原则：把一个标签的各个属性想象成一个洞，不同样式中的声明会按读取顺序向洞中填球，其中后读取的声明会覆盖洞中原来的球。
3.选择器
分类
- 简单选择器（根据标签、id、类来选取元素）
- 组合器选择器（根据它们之间的特定关系来选取元素）
- 伪类选择器（根据特定状态选取元素）
- 伪元素选择器（选取元素的一部分并设置其样式）
- 属性选择器（根据属性或属性值来选取元素）
选择器的权重
内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器
4.标签的分类
行内标签：
行内元素不会开始新的行。它们的宽度和高度基本上由内容决定，用CSS设置高度和宽度无效。
块级标签：
块级元素会占据其父元素的整个宽度（除非设置了特定的宽度），并在内容前后都会生成“换行”。它们的宽度默认是父元素的100%，高度由内容决定，也可以用CSS来指定高度和宽度。
5.CSS的颜色
三种设置方式
1. 用颜色的名字设置
2. 用(红 绿 蓝)三个颜色的权重来设置
- rgb：rgb(red,green,blue)
- HEX：#rrggbb，其中rr（红色）、gg（绿色）和 bb（蓝色）是介于 00 和 ff 之间的十六进制值。
3. 用(色相 饱和度 明度)的权重来设置
- HSL：hsl(hue,saturation,lightness)
6. 容器的高度和宽度：
- 容器的宽度默认为一整行，容器的高度默认为容器内部标准流元素合起来的最大高度。
7. 浮动：
- 浮动的元素只能在父级盒子中浮动，浮动元素处于父级盒子中其他普通元素的上层。
- 浮动的元素只能左右浮动，即在自己该水平左右浮动，浮动后的元素不属于标准流，自己的位置空出。
浮动所造成的特殊情况：
- 父元素高度塌陷：当父元素未设置高度时，其高度由标准流子元素的高度合起来决定，而当子元素都浮动时，此时标准流中无元素，故父元素也无高度。
8. 定位：
- 定位的步骤：①设置position属性 ②用上下左右四个属性设置位置
- 定位的分类：绝对定位：每个元素进行绝对定位，该元素就上升一个层级。 固定定位：和绝对定位类似，但元素始终固定在屏幕的一个位置。
定位的特殊情况：
1.相对定位和绝对定位的元素基于最靠近的有定位的父级元素进行定位。
