本文目錄導(dǎo)讀：
CSS Position屬性詳解及其應(yīng)用
CSS Position屬性是CSS布局中非常重要的一個(gè)屬性，它允許***對(duì)元素進(jìn)行***的定位，本文將詳細(xì)介紹Position屬性的使用，但不涉及如何使用百分比。
靜態(tài)定位（Static）
靜態(tài)定位是Position屬性的默認(rèn)值，在靜態(tài)定位下，元素按照正常的文檔流進(jìn)行排列，這種定位方式不涉及百分比的使用。
相對(duì)定位（Relative）
相對(duì)定位是相對(duì)于元素在文檔流中的原始位置進(jìn)行定位，當(dāng)使用百分比來(lái)設(shè)定偏移量時(shí)，它是相對(duì)于包含塊的寬度和高度的，使用“position: relative; left: 50%;”將使元素相對(duì)于包含塊向左偏移一半的寬度。
***定位（Absolute）
***定位是相對(duì)于***近的已定位祖先元素（非static的元素）進(jìn)行定位，如果沒(méi)有已定位的祖先元素，那么它會(huì)相對(duì)于初始包含塊進(jìn)行定位，在使用百分比時(shí)，也是相對(duì)于包含塊的寬度和高度的?！皃osition: absolute; top: 20%;”將使元素相對(duì)于包含塊向下偏移20%的高度。
固定定位（Fixed）
固定定位是相對(duì)于瀏覽器窗口進(jìn)行定位的，即使頁(yè)面滾動(dòng)，它也會(huì)停留在同一位置，在使用百分比時(shí)，也是相對(duì)于視口（viewport）的寬度和高度的?！皃osition: fixed; right: 30%;”將使元素固定在視口的右側(cè)30%的位置。
粘性定位（Sticky）
粘性定位可以被認(rèn)為是相對(duì)定位和固定定位的混合，元素在跨越特定閾值之前為相對(duì)定位，之后為固定定位，百分比的使用方式與相對(duì)定位和固定定位相同。
CSS Position屬性提供了強(qiáng)大的布局能力，通過(guò)百分比的使用，我們可以更***地控制元素的位置，但要注意，百分比的使用是基于包含塊的寬度和高度的，因此要確保包含塊有明確的尺寸，不同的定位類型在使用百分比時(shí)有不同的參照物，需要根據(jù)具體情況進(jìn)行選擇和使用。
