1. 背景
背景指的是元素内容、内边距和边界下层的区域
(可用background-clip修改)
- background-color 背景色
- background-image 背景图片（url）
- background-repeat 背景重复
- repeat 在水平垂直方向上都平铺
- repeat-x / repeat-y 只在水平/垂直方向上重复
- no-repeat 不允许图像在任何方向上平铺
- background-position 背景定位
- top、bottom、left、right 和 center（可以一水平一垂直成对出现，只出现一个默认center）
- 长度值，如 100px 或 5cm（只应用于元素，偏移点是图像的左上角） 先水平再垂直
- 百分数值（百分数值同时应用于元素和图像，左上角为0% 0%）
- background-attachment 相对于可视区是固定的（fixed）/默认值滚动（scroll）
2. 边框
样式
solid、dotted、dashed、double、groove、ridge、inset、outset、none、inherit
实线上边框、点线右边框、虚线下边框和一个双线左边框：
border-style: solid dotted dashed double; //top-right-bottom-left 的顺序
宽度
border-width：指定长度值，比如 2px 或 0.1em/3 个关键字之一，它们分别是 thin 、medium（默认值） 和 thick
"border-width" 属性如果单独使用的话是不会起作用的。请首先使用 "border-style" 属性来设置边框。
颜色
border-color
可以所有边框属性在一个声明中：border: medium double rgb(250,0,255)；
3. 列表
要修改用于列表项的标志类型，可以使用属性 list-style-type
想对各标志使用一个图像，这可以利用 list-style-image 属性（url）
4. 链接
- a:link - 普通的、未被访问的链接
- a:visited - 用户已访问的链接
- a:hover - 鼠标指针位于链接的上方
- a:active - 链接被点击的时刻
次序规则：
a:hover 必须位于 a:link 和 a:visited 之后
a:active 必须位于 a:hover 之后
5. 选择器
选择器的分组与继承
分组：逗号隔开
继承：特殊规则就可以摆脱继承
派生选择器
通过依据元素在其位置的上下文关系来定义样式（上下文选择器）
伪类选择器
CSS 伪类用于向某些选择器添加特殊的效果。
CSS 伪元素用于将特殊的效果添加到某些选择器。
两者区别在于: 伪类的效果可以通过添加一个实际的类来达到，而伪元素的效果则需要通过添加一个实际的元素才能达到
用于选择处于特定状态的元素，例如，它们是其类型的第一个元素，或者它们被鼠标指针悬停。（因为行为被定义为一个类）
1. 简单伪类
-
:last-child -
:only-child -
:invalid - ：first-child
2. 用户操作伪类
-
:hover- 上文提到的; 仅当用户将指针移动到元素（通常是链接）上时才适用。 -
:focus- 仅在用户使用键盘控件聚焦元素时适用。
伪元素：::before和::after伪元素与content属性一起使用称为“生成的内容”
组合
1. 后代组合器 有共同的祖先（直接空格）
2. 子组合器 第一个选择器的直接子元素（用>连接） //比如选择的是ul>li 那么ul-span-li就不能算了
3. 相邻同级组合器 与第一个选择器同级的第一个选择器2元素（用+连接）
4. 通用同级组合器 与第一个选择器同级的所有选择器2元素（用~连接）
6. 选择器的优先级
层叠
①按特殊性排序，特殊性高的优先
②按出现顺序排序，越后出现的权重就越大。
③!important总是优先于其他规则
特殊性:
内联样式1000;
ID属性100;
类属性/属性选择/伪类010;
元素/伪元素001
通用选择（*），组合子（+，>，~，'“），以及否定伪类（:not）对特异性没有影响。
继承控制：
inherit将应用于选定元素的属性值设置为其父元素的属性值。实际上，这“继承”。
initial将应用于选定元素的属性值设置为该属性的初始值。
unset将属性重置为其自然值，这意味着，如果该属性是自然继承的，则其行为类似于inherit，否则，其行为类似于initial。
重置所有属性值： all: unset;