CSS——定位模式

在浏览器上运行网页时，浏览器会使用盒子模型来计算网页文件中的标签该如何显示在网页上。盒子模型的定义里，每个显示在网页上的标签都是一个矩形对象，浏览器上显示的网页是友这些代表标签的矩形对象所组成。换个角度说，可以讲整个网页作为一个大的矩形对象，这个代表网页的矩形对象能够容纳其他代表标签的矩形对象。而浏览器在预设的模式下，是使用流动定位的计算方式来计算父矩形对象中所容纳子矩形对象显示的位置。

流动定位的概念里，矩形对象的内容区域被切割成一行一行的配置空间，每一行的配置空间可以放置多个矩形对象。这些一行一行的配置空间，高度是由空间内放置的矩形对象高度来决定，宽度则是依照内容区域宽度来决定。浏览器会依照HTML标签出现的顺序，将代表标签的矩形对象依序配置到配置空间，当配置空间的宽度不足以配置矩形区域的时候，就会创建一行新的配置空间来配置矩形对象。

1.相对定位：当开发人员为矩形对象定义相对定位后，矩形对象一开始还是会依照流动定位的方式来计算定位，但在流动定位计算完毕后，有定义相对定位的矩形对象，就会从流动定位安排的位置上，依照相对定位样式来移动位置。（在原来的位置上进行移动）。

2.绝对定位：定位为绝对定位的矩形对象，不参与流动定位的计算，而是直接依照绝对定位样式来配置位置。也就是说，浏览器依照流动定位计算矩形对象时，如遇到定义为绝对定位的矩形对象，就会略过这个矩形对象，直接计算下一个矩形对象。而这个被略过的矩形对象，则会依照绝对定位样式来计算位置。

定位基准：每个矩形对象被包含在一个父矩形对象的内容区域中，这样一层一层包覆直到最外层的浏览器。绝对定位是寻找上一级不是使用流动定位的矩形对象，然后把这个矩形对象作为基准；如果一直找不到就是最外层的浏览器了。

3.固定定位：以浏览器显示网页的窗口作为定位基准，不管网页内容有多长，滚动条怎么拉，只要浏览器的窗口大小没有变化，使用固定定位的矩形对象的位置就不会动。