<div> 是 HTML 中的一個重要元素，被稱為“div 區”。它是一個無語義的容器，通常用于對 HTML 內容進行分組或布局控制。在這篇文章中，我們將探討如何使用 CSS 來樣式化 <div> 區和對其進行布局。
<div> 元素通過 CSS 選擇器選擇，并在 CSS 中進行樣式化。通過設置不同的樣式屬性，我們可以使 <div> 區具有不同的顏色、字體、邊框和背景等效果。以下是一些實際的代碼案例，詳細說明了如何使用 CSS 對 <div> 區進行樣式化和布局控制。
1. 設置背景顏色：

CSS 代碼：

div {
background-color: lightblue;
}

上述代碼示例將 <div> 區的背景顏色設置為淺藍色（lightblue）。您可以根據需要更改顏色值，如 "red"（紅色）或 "#FFFF00"（黃色）等。
2. 設置邊框：

CSS 代碼：

div {
border: 1px solid black;
}

上述代碼示例將 <div> 區的邊框設置為 1 像素的實線邊框，并將邊框顏色設置為黑色（black）。您可以根據需要調整邊框寬度和顏色。
3. 設置寬度和高度：

CSS 代碼：

div {
width: 200px;
height: 100px;
}

上述代碼示例將 <div> 區的寬度設置為 200 像素，高度設置為 100 像素。您可以根據實際情況調整寬度和高度的數值。
4. 設置內邊距和外邊距：

CSS 代碼：

div {
padding: 10px;
margin: 20px;
}

上述代碼示例將 <div> 區的內邊距設置為 10 像素，外邊距設置為 20 像素。內邊距是元素內容和邊框之間的空間，而外邊距是元素邊框和其它元素之間的空間。您可以根據需要調整內外邊距的數值。
5. 設置布局：

CSS 代碼：

div {
display: flex;
justify-content: center;
align-items: center;
}

上述代碼示例通過使用 flex 布局模型，將 <div> 區居中顯示。display 屬性指定了布局模型，justify-content 屬性用于水平對齊，align-items 屬性用于垂直對齊。您可以根據需要使用不同的布局模型和對齊方式。
通過以上幾個代碼案例，我們可以看到如何使用 CSS 對 <div> 區進行樣式化和布局控制。您可以根據具體的需求使用不同的 CSS 屬性和取值來設置 <div> 區的各種樣式。希望這篇文章對您理解和應用 CSS 中的 <div> 區有所幫助。