一.position说明

定位是脱离标准文档流，精确设置HTML页面中各个元素的位置。可以是绝对位置，也可以是相对位置。

标准文档流即在HTML页面中元素一行接一行依次排列，由块级元素和内联元素组成。块级元素自动换行垂直排列，内联元素紧挨着水平排列，不换行。

position属性可以用来设置元素所采用的定位类型，相关的属性值有：static、absolute、relative。

本文引用地址：//mi.hqyj.com/web/html5/562.html

二.定位类型

1. static

设置position:static;表示无定位，这是定位的默认类型，元素遵循标准文档流的排列规则。

2. absolute

设置position:absolute;表示绝对定位，相对于元素的父级元素进行定位。

可以通过top、right、bottom和left属性一同使用，设置偏移量。如果没有设置这四个属性，则默认父级元素的左上角为坐标原点。

注意：使用绝对定位的元素以它近的一个“已经定位”的“祖先元素” 为基准进行定位。如果没有已经定位的祖先元素，那么会以body为基准进行定位。

3. Relative

设置position:relative;表示相对定位，对象不允许重叠。在进行相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其他元素。

4. fixed

设置position:fixed;表示固定定位，fixed目前还不被一些浏览器支持，实际网页制作中也不常用。

固定定位和绝对定义比较相似，它是绝对定位的一种特殊形式，固定定位的容器不会随着滚动条的拖动而变化位置。

提示：固定定位的参照位置不是上级元素块而是浏览器窗口。所以可以使用固定定位来设定类似传统框架样式布局，以及广告框架或导航框架等。使用固定定位的元素可以脱离页面，无论页面如何滚动，始终处在页面的同一位置上。