css定位属性

网页中大部分对象默认是占用文档流，也有一些对象是不占文档流的，比如表单中隐藏域。当然我们也可以让占用文档流的元素转换成不占文档流，这就要用到CSS中属性position、float、display来控制。

默认情况下，所有元素都处在文档流中，四种情况将使得元素离开文档流：浮动float、绝对定位absolute、相对定位fixed、元素不显示display:none，这种情况不占文档流的空间，而普通元素的位置基于文档流。

文档流：自窗体自上而下分成一行一行，并在每行中按从左到右的顺序排放元素。

position定位

position定位：规定元素的定位类型。即元素脱离文档流的布局，在页面的任意位置显示。

定位类型：绝对定位（absolute）、相对定位（relative）、固定定位（fixed）和默认的文档流布局方式（static）。

辅助属性：

position属性只是使元素脱离文档流，要想此元素能按照希望的位置显示，就需要使用下面的属性：

left ： 表示向元素的左边插入多少像素，使元素向右移动多少像素。

right ：表示向元素的右边插入多少像素，使元素向左移动多少像素。

top ：表示向元素的上方插入多少像素，使元素向下移动多少像素。

bottom ：表示向元素的下方插入多少像素，使元素向上移动多少像素。

数值可以设置为负值

relative相对定位属性

相对定位：不脱离文档流的布局，只改变自身的位置，在文档流原先的位置遗留空白区域。定位的起始位置为此元素原先在文档流的位置。

相对定位后，元素位置移动了，但是原来的位置还占据着。

absolute绝对定位属性

绝对定位：脱离文档流的布局，遗留下来的空间由后面的元素填充。定位的起始位置为最近的父元素(postion不为static)，否则为body文档本身。

fixed 固定定位

固定定位：fixed是特殊的absolute，按照浏览器的窗口进行定位。

z-index属性

z-index属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。z-index取值为整数类型，可以是负值，z-index 仅能在定位元素上奏效，如position:absolute。