在開發網頁時，CSS 可以讓我們實現各種各樣的樣式效果，包括移動元素的位置。實現位置移動的方法有多種，下面就為大家介紹幾種常用的 CSS 樣式。

1.

position

屬性

position: static;
position: relative;
position: absolute;
position: fixed;

其中，靜態定位

static

是默認屬性值，不會對元素位置造成影響。相對定位

relative

是相對于元素原來的位置進行定位。絕對定位

absolute

是相對于最近的非 static 定位的祖先元素進行定位。固定定位

fixed

是相對于瀏覽器窗口進行定位，不會隨著頁面滾動而移動。

2.

left/top/right/bottom

屬性

使用這些屬性可以分別指定元素的左側、頂部、右側和底部位置，值可以是正值、負值或百分比。

div {
position: absolute;
left: 100px;
top: 50px;
}

3.

transform

屬性

使用這個屬性可以更細致地控制元素的位置。該屬性的參數包括 translate、rotate、scale 等。其中，translate 可以控制元素的水平和垂直位移。

div {
transform: translate(50px, 30px);
}

通過掌握這些常用的 CSS 樣式，我們可以輕松地實現元素位置移動的效果。