s## 介于最近在寫demo時這方面又開始云里霧里，概念混淆，看了51CTO上的一篇分析豁然開朗，決定做點(diǎn)總結(jié)。

常用的定位可分為以下四種:
1.static: 元素的定位默認(rèn)值。元素出現(xiàn)在正常的文檔流中。top, left, right, bottom,z-index聲明無效，言意上對于static的元素是沒有任何效果。

2.relative: 相對定位。通過top, left, right, bottom相對于其正常位置進(jìn)行定位。

3.absolute: 絕對定位。相對于除static定位以外（即relative, absolute, fixed）的第一個父元素進(jìn)行定位。可通過top, left, right, bottom進(jìn)行定位。

4.fixed: 絕對定位，相對于瀏覽器窗口進(jìn)行定位，可通過top, left, right, bottom進(jìn)行定位。

relative:

定位為relative的元素出現(xiàn)在正常的文本流中，即其在文本流中的位置依然存在。如圖：

Paste_Image.png

absolute:

定位absolute的元素脫離在正常文本流，但與relative的區(qū)別在于其在文本流中的位置不存在，如圖：

Paste_Image.png

relative與absolute的主要區(qū)別：

• relative定位的層總是相對于其最近的父元素，無論父元素采用什么定位方式。
• absolute定位的層總是相對于最近的除了static定位的父層元素進(jìn)行定位。如果最近的父元素層中沒有絕對或者相對定位，則將其相對于body進(jìn)行定位，如圖：

Paste_Image.png