CSS样式：浮动 图片链接 雪碧图

元素的定位体系、定位体系的判断、常规流盒模型中的尺寸、盒子的位置、浮动、常规流盒子和浮动盒子混合摆放、清除浮动、盒子的相对位置、元素重叠的问题、制作图片链接、使用figure和caption表示图片单元、实现雪碧图的步骤：（非块级元素）

1. 视觉格式化模型规定，定位体系一共有三种：①常规流（normal flow）②浮动（float）③绝对定位（absolute positioned）；任何一个元素，必须属于其中一种定位体系；不同的定位体系中，元素在包含块中的尺寸和位置会有一些差异。

2.定位体系的判断：常规流、绝对定位、浮动。

3.常规流盒模型中的尺寸：只有margin中可以取负值；照不同体系中的规则计算的

4.盒子的位置：盒子在包含块的垂直方向上依次摆放，盒子在包含块中占据的尺寸是整个盒子的尺寸，垂直方向上，若两个外边距相邻，则进行合并（折叠）【margin的垂直方向都是正值的时候取最大值、一正一负进行相加、两个都是负值时取最小值；margin的合并：垂直、相邻】。

5.浮动：当元素的float属性取值为left和right时，元素属于浮动定位（不可以继承、默认值：none 取值：none、left、right）当一个元素浮动时：宽度取auto自动值时 取值：适应内容宽度、高度自动时：取值：适应内容高度、上下左右为自动值时取值为：0px；盒子的位置①左浮动的盒子向上向左排列②右浮动的盒子向上向左排列③浮动盒子的顶边不得高于上一个盒子的顶边斯若剩余空间无法放下浮动的盒子，则该盒子向下移动，直到具备足够的空间能容纳盒子，然后再向左或向右移动。

6.常规流盒子和浮动盒子混合摆放：浮动盒子在摆放时，要避开常规流盒子；常规流盒子在摆放时，无视浮动盒子；如果我们设置的某一个标签为浮动流，那么它就会脱离文档流（表示浮动元素的内容不占用父级的content区域，称为高度坍塌）。

7.