HTML中設(shè)置div的位置是網(wǎng)頁(yè)布局中很重要的一部分。通過(guò)CSS樣式來(lái)設(shè)置div的位置，可以讓頁(yè)面更加美觀、整潔。下面我們就來(lái)學(xué)習(xí)一下如何設(shè)置div的位置。 使用CSS設(shè)置div的位置，首先要利用“position”屬性，它有三個(gè)屬性值：“static”、“relative”和“absolute”。其中，“static”是默認(rèn)值，沒(méi)有定位。如果想要讓div元素跟隨頁(yè)面滾動(dòng)，可以使用“fixed”屬性值，表示固定在某個(gè)位置不動(dòng)。 下面是一個(gè)例子，展示如何使用CSS設(shè)置div的位置：

<style>
/* 結(jié)合使用position和top屬性 */
#box {
position: relative; /* 設(shè)置相對(duì)定位 */
top: 30px; /* 將div向下移動(dòng)30px */
}
</style>
<div id="box">
<p>這是一個(gè)div標(biāo)簽。</p>
</div>

這個(gè)例子中，我們利用了CSS中的“relative”屬性值和“top”屬性來(lái)設(shè)置div的位置。在div的CSS樣式中，我們將#box設(shè)為相對(duì)定位，然后使用top屬性來(lái)將div向下移動(dòng)了30px。 使用CSS定位屬性，還有一種方式是使用絕對(duì)定位（相對(duì)于其父元素）。在下面的例子中，div元素相對(duì)于它的父元素設(shè)置了絕對(duì)位置：

<style>
/* 使用position和top、left屬性 */
.parent{
position:relative; 
}
#box{
position:absolute;
top:10px;
left:10px;
}
</style>
<div class="parent">
<div id="box">
<p>這是一個(gè)div標(biāo)簽。</p>
</div>
</div>

在這個(gè)例子中，“parent”被設(shè)置為“relative”，而“box”被設(shè)置為“absolute”。此外，我們還使用了“top”和“l(fā)eft”屬性來(lái)定位div元素相對(duì)于其父元素的位置。在這個(gè)例子中，我們將“box”元素向下移動(dòng)10px，向左移動(dòng)10px。 總之，使用CSS樣式設(shè)置div元素的位置是很容易的。只需要繼續(xù)練習(xí)，并了解不同的定位屬性，你就能夠快速、簡(jiǎn)便地將頁(yè)面布局設(shè)計(jì)得更好了。