詳細解讀頁面配置之position定位

下面是我給大家整理的頁面配置之position定位，有興趣的同學可以去看看。

在利用div+CSS進行頁面配置時，position定位的理解如下：

1.（當前元素的）position：relative，不脫離文檔流的布局，相對於自身位置的位移，原自身位置出現空白時後面的元素不會進行填充，也即當前元素與後面元素的相對位置（或稱相對順序）不會發生改變，我通常理解為：無論怎樣，當前元素與後續元素的前後順序不會發生改變。

2.（當前元素的）position：absolute，脫離文檔流的布局，原自身位置出現空白時由後面的元素進行填充，定位的起始位置是父元素（position不是static）或者body，也即當前元素相對於父元素或者body的位置是固定不變的，但是後續的元素可能會移動到當前元素的前面，我通常理解為：當前元素與後續元素的前後順序可能會發生改變。

3.（當前元素的）position：fixed，與absolute類似，但是不隨捲軸的移動而改變位置（比如有些網頁右下角放置的廣告，當下拉捲軸時，廣告的位置是不變的），當瀏覽器縮小到此元素不可見時，頁面上不會出現捲軸。

4.（當前元素的）position：static，預設值。

上面是我整理給大家的頁面配置之position定位，希望今後會對大家有協助。

相關文章：

詳細介紹有關CSS頁面配置技巧

詳細講解CSS基礎知識點

jquery+CSS3實現下拉導覽功能表功能