CSS 定位 (Positioning) 屬性允許你對(duì)元素進(jìn)行定位。
CSS 定位機(jī)制:
????????CSS 有三種基本的定位機(jī)制：普通流、浮動(dòng)和絕對(duì)定位。
CSS position 屬性
????????通過使用?position 屬性，我們可以選擇 5 種不同類型的定位static，relative，fixed，absolute，sticky
????????設(shè)定position屬性后，元素可以使用的頂部，底部，左側(cè)和右側(cè)屬性定位。
position 屬性值的含義：
? ??????static:
????????????????HTML 元素的默認(rèn)值，即沒有定位，遵循正常的文檔流對(duì)象。靜態(tài)定位的元素不會(huì)受到 top, bottom, left, right影響。
????????????????元素框正常生成。塊級(jí)元素生成一個(gè)矩形框，作為文檔流的一部分，行內(nèi)元素則會(huì)創(chuàng)建一個(gè)或多個(gè)行框，置于其父元素中。
? ??????relative:
? ??????????????元素框偏移某個(gè)距離。元素仍保持其未定位前的形狀，它原本所占的空間仍保留。是相對(duì)于默認(rèn)位置的相對(duì)定位，通過設(shè)置left、top、? right、bottom值可將其移至相對(duì)于其正常位置的地方（相對(duì)于自己的開始的位置發(fā)生的位置上的移動(dòng)，【不會(huì)破壞正常的布局流，占據(jù)空間】）
? ??????absolute:
????????????????絕對(duì)定位的元素的位置相對(duì)于最近的已定位父元素，如果元素沒有已定位的父元素，那么它的位置相對(duì)于<html>。
????????????????相對(duì)于父級(jí)元素的絕對(duì)定位，浮出、脫離布局流，它不占據(jù)空間，可直接指定“l(fā)eft”、“top”、“right” 以及 “bottom”屬性。(層疊的順序z-index:value)
? ??????fixed:
????????????????相對(duì)瀏覽器的絕對(duì)定位，是相對(duì)于瀏覽器窗口的指定坐標(biāo)進(jìn)行定位，元素的位置相對(duì)于瀏覽器窗口是固定位置。即使窗口是滾動(dòng)的它也不會(huì)移動(dòng)。
????????????????此元素的位置可通過 "left"、"top"、"right" 以及"bottom" 屬性來規(guī)定。
? ??????sticky
????????????????基于用戶的滾動(dòng)位置來定位，粘性定位的元素是依賴于用戶的滾動(dòng)，在?position:relative?與?position:fixed?定位之間切換。
????????????????它的行為就像?position:relative;?而當(dāng)頁面滾動(dòng)超出目標(biāo)區(qū)域時(shí)，它的表現(xiàn)就像?position:fixed;，它會(huì)固定在目標(biāo)位置。
定位元素層次關(guān)系:
? ??????z-index : auto |number? ??
????????????????元素的定位與文檔流無關(guān)，所以它們可以覆蓋頁面上的其它元素
????????????????z-index屬性指定了一個(gè)元素的堆疊順序（哪個(gè)元素應(yīng)該放在前面，或后面）
????????????????設(shè)置屬性值后，具有更高堆疊順序的元素總是在較低的堆疊順序元素的前面
????????????????沒有指定z - index，最后定位在HTML代碼中的元素將被顯示在最前面。
