CSS分塊的基本思想是將頁(yè)面內(nèi)容劃分為多個(gè)可重復(fù)使用的單元，稱為塊。每個(gè)塊都有自己的樣式和布局，可以相互嵌套和組合。通過(guò)使用div元素和CSS樣式，可以給這些塊設(shè)定不同的屬性，如寬度、高度、背景色等，從而實(shí)現(xiàn)個(gè)性化的布局效果。
下面是一個(gè)簡(jiǎn)單的實(shí)例，展示如何使用CSS div分塊：
<div id="header"> <h1>這是頁(yè)面標(biāo)題</h1> </div> <br> <div id="content"> <p>這是頁(yè)面內(nèi)容</p> </div> <br> <div id="footer"> <p>這是頁(yè)腳</p> </div>
在上面的代碼中，我們使用了三個(gè)div塊元素，分別代表頁(yè)面的頭部、內(nèi)容和頁(yè)腳。通過(guò)CSS樣式，我們可以給每個(gè)塊元素設(shè)置不同的屬性，如背景色、邊距、定位等等。
下面是一個(gè)使用CSS樣式的示例，實(shí)現(xiàn)了一個(gè)基本的頁(yè)面布局：
<style>
#header {
background-color: #f2f2f2;
padding: 20px;
text-align: center;
}
<br>
#content {
background-color: #ffffff;
padding: 50px;
margin: 20px;
}
<br>
#footer {
background-color: #f2f2f2;
padding: 10px;
text-align: center;
}
</style>
<br>
<div id="header">
<h1>這是頁(yè)面標(biāo)題</h1>
</div>
<br>
<div id="content">
<p>這是頁(yè)面內(nèi)容</p>
</div>
<br>
<div id="footer">
<p>這是頁(yè)腳</p>
</div>在上面的代碼中，我們使用了CSS樣式為每個(gè)塊元素設(shè)置了不同的屬性。其中，頭部塊設(shè)置了背景色和居中對(duì)齊的文本；內(nèi)容塊設(shè)置了背景色、內(nèi)邊距和外邊距；頁(yè)腳塊設(shè)置了背景色和居中對(duì)齊的文本。通過(guò)這些樣式設(shè)置，我們實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的頁(yè)面布局效果。
除了基本的布局外，CSS div分塊還可以用于更復(fù)雜的頁(yè)面布局。例如，可以通過(guò)使用CSS的浮動(dòng)屬性將多個(gè)div塊排列在一行或一列，實(shí)現(xiàn)水平或垂直布局。也可以使用CSS的定位屬性將div塊精確地放置在頁(yè)面的任意位置。此外，還可以通過(guò)CSS的樣式屬性來(lái)調(diào)整塊元素的大小、顏色、邊框等，實(shí)現(xiàn)更多樣化的布局效果。
總之，CSS div分塊是一種常用的網(wǎng)頁(yè)布局技術(shù)，通過(guò)使用div元素和CSS樣式，可以將頁(yè)面內(nèi)容劃分為多個(gè)獨(dú)立的塊，實(shí)現(xiàn)個(gè)性化的布局效果。無(wú)論是簡(jiǎn)單的布局還是復(fù)雜的布局，通過(guò)靈活運(yùn)用CSS的樣式和屬性，我們可以輕松實(shí)現(xiàn)各種各樣的頁(yè)面布局效果。