CSS 选择器

• 元素选择器

• id 选择器

• 类选择器（针对所有元素）

• 类选择器（只针对 <p> 元素）

• 引用两个类的 HTML 元素

• 通用选择器

• 分组选择器

实例解释：CSS 选择器

CSS 使用

• 外部 CSS

• 内部 CSS

• 行内 CSS

• 多个样式表

• 层叠顺序

实例解释：如何添加 CSS

CSS 注释

• 单行注释

• 多行注释

实例解释：CSS 注释

CSS 颜色

• 设置颜色的背景色

• 设置文本颜色

• 设置边框颜色

• 设置不同的颜色值

• 设置 RGB 值

• 设置 HEX 值

• 设置 HSL 值

实例解释：CSS 颜色

CSS 背景

• 设置页面的背景色

• 设置不同元素的背景色

• 把图像设置为页面背景

• 如何只在水平方向重复背景图像

• 如何定位背景图像

• 固定的背景图像（该图像不会随着页面的其余部分滚动）

• 所有背景属性在一条声明中

• 高级背景实例

实例解释：背景属性

CSS 边框

• 设置四条边框的宽度

• 设置上边框的宽度

• 设置下边框的宽度

• 设置左边框的宽度

• 设置右边框的宽度

• 设置四条边框的样式

• 设置上边框的样式

• 设置下边框的样式

• 设置左边框的样式

• 设置右边框的样式

• 设置四条边框的颜色

• 设置上边框的颜色

• 设置下边框的颜色

• 设置左边框的颜色

• 设置右边框的颜色

• 所有边框属性在一条声明中

• 为元素添加圆角

• 为每个边设置不同的边框

• 所有上边框属性在一条声明中

• 所有下边框属性在一条声明中

• 所有左边框属性在一条声明中

• 所有右边框属性在一条声明中

实例解释：边框属性

CSS 外边距

• 为元素的各边规定不同的外边距

• 使用带有四个值的简写 margin 属性

• 使用带有三个值的简写 margin 属性

• 使用带有两个值的简写 margin 属性

• 使用带有一个值的简写 margin 属性

• 把外边距设置 auto，来居中其容器内的元素

• 让左外边距继承父元素

• 外边距合并

实例解释：外边距属性

CSS 内边距

• 为元素的各边规定不同的内边距

• 使用带有四个值的简写内边距

• 使用带有三个值的简写内边距

• 使用带有两个值的简写内边距

• 使用带有一个值的简写内边距

• 内边距和元素宽度（不设置 box-sizing）

• 内边距和元素宽度（设置 box-sizing）

• 设置元素的左内边距

• 设置元素的右内边距

• 设置元素的上内边距

• 设置元素的下内边距

实例解释：内边距属性

CSS 高度/宽度

• 设置元素的高度和宽度

• 设置元素的最大宽度

• 设置不同元素的高度和宽度

• 使用百分百来设置图像的高度和宽度

• 设置元素的最小宽度和最大宽度

• 设置元素的最小高度和最大高度

实例解释：定位属性

CSS 盒模型

• 演示盒模型

• 规定总宽度为 250 像素的元素

实例解释：盒模型

CSS 轮廓

• 绘制围绕元素的线条（轮廓）

• 设置轮廓的样式

• 设置轮廓的颜色

• 使用 outline-color：翻转轮廓

• 设置轮廓的宽度

• 使用简写的轮廓属性

• 在元素的轮廓与边框之间添加空间

实例解释：轮廓属性

CSS 文本

• 设置不同元素的文本色

• 对齐文本

• 删除链接下面的线

• 修饰文本

• 控制文本中的字母大小写

• 缩进文本

• 规定字符间距

• 规定行间距

• 设置元素的文本方向

• 增加字间距

• 规定元素的文本阴影

• 在元素内禁用文本换行

• 垂直对齐文本内的图像

实例解释：文本属性

CSS 字体

• 设置文本的字体

• 设置字体的大小

• 以 px 为单位设置字体大小

• 以 em 为单位设置字体大小

• 以百分百和 em 为单位设置字体大小

• 设置字体的样式

• 设置字体的变体

• 设置字体的粗细

• 所有字体属性在一条声明中