<div>是HTML中的一個標簽，用于將文檔分割成獨立的、互不影響的區域，從而方便進行樣式化和布局。在網頁設計中，常常使用<div>來創建不同的塊狀顯示效果。下面將通過幾個代碼案例來詳細解釋說明div塊狀顯示的使用方法。
第一個案例是創建一個簡單的div塊狀顯示效果。我們可以使用以下代碼實現：

<p><div></p>
<p>    這是第一個div塊</p>
<p></div></p>

在這個例子中，我們使用<div>標簽將文本內容“這是第一個div塊”包裹起來。通過CSS樣式化，我們可以為這個div塊設置字體、背景顏色、邊框等屬性，從而實現不同的顯示效果。
第二個案例是創建一個包含多個div塊的布局。我們可以使用以下代碼實現：

<p><div class="container"></p>
<p>    <div class="box1"></p>
<p>        這是第一個div塊</p>
<p>    </div></p>
<p>    <div class="box2"></p>
<p>        這是第二個div塊</p>
<p>    </div></p>
<p></div></p>

在這個例子中，我們使用了一個外層的<div>標簽，類名為“container”，用于包含內層的兩個<div>塊。每個內層的<div>標簽都有一個不同的類名，分別為“box1”和“box2”。通過CSS樣式化，我們可以為這兩個<div>塊設置不同的大小、位置或樣式。
第三個案例是創建一個帶有圖片的div塊狀顯示效果。我們可以使用以下代碼實現：

<p><div class="image-container"></p>
<p>    <img src="image.jpg" alt="圖片"></p>
<p>    <p>這是一個圖片</p></p>
<p></div></p>

在這個例子中，我們使用了一個外層的<div>標簽，類名為“image-container”，用于包含內層的<img>和

標簽。通過CSS樣式化，我們可以調整圖片和文字的位置、大小和樣式，從而實現一個帶有圖片的div塊狀顯示效果。
通過以上案例，我們可以看到<div>標簽的作用和使用方法。它可以將文檔中的內容分割成獨立的區域，方便進行樣式化和布局。通過CSS樣式化的設置，我們可以為<div>塊設置不同的大小、位置、背景、邊框等屬性，從而實現多樣化的顯示效果。在網頁設計中，充分利用<div>標簽可以幫助我們更好地進行布局和設計，提升用戶體驗。