CSS3新增了很多位置屬性，這些屬性可以幫我們更好地控制HTML元素在網頁中的位置。下面我們來一一了解它們：

position: static/relative/absolute/fixed/sticky;

position 屬性定義了元素的定位類型。

靜態定位（默認）：position: static;

相對定位：position: relative;
元素會相對自己原有的位置進行移動，但不會脫離文本流。可以與 top、right、bottom、left 配合使用。

絕對定位：position: absolute;
元素會相對于離它最近的已定位（position不為 static）的祖先元素進行移動。如果沒有已定位的祖先元素，則相對于 body 元素。會脫離文本流。可以與 top、right、bottom、left 配合使用。

固定定位：position: fixed;
元素會相對于瀏覽器窗口進行移動，不會隨著滾動而移動，常用于固定頭部或側邊欄等。可以與 top、right、bottom、left 配合使用。

粘性定位：position:sticky;
IE瀏覽器不支持，元素在跨越特定閾值前為相對定位，之后為固定定位，實現吸附效果。需要設置 top、right、bottom、left 至少一個值。

z-index: number;

z-index 屬性定義了元素的層級關系，數值越大，元素越靠上。

top: length/percentage/auto;
right: length/percentage/auto;
bottom: length/percentage/auto;
left: length/percentage/auto;

top、right、bottom、left 屬性決定了元素離父容器的距離，可以是具體的像素值，也可以是百分比。

總結：position、z-index 和 top、right、bottom、left 屬性可以一起使用，輔助元素的定位，使其在頁面中呈現出更好的視覺效果。