<div> 是 HTML 中的一個標簽，常用于區分不同的頁面元素或分組內容。它可以幫助我們將頁面內容劃分為不同的區塊，便于進行樣式設置或JavaScript 操作。在本文中，我們將通過一些代碼案例詳細解釋 <div> 標簽的使用。
第一個代碼案例，我們先看一個簡單的例子，演示如何使用 <div> 標簽創建一個包含兩個段落的主體區塊。

<div>
<p>這是第一個段落。</p>
<p>這是第二個段落。</p>
</div>

在這個例子中，我們使用兩對

標簽來包裹兩個段落，然后將它們放在一個 <div> 標簽中。這樣，兩個段落就被組合在一個 <div> 區塊內。
接下來，我們來看一個使用 <div> 標簽為頁面中的內容分組和設置樣式的例子。

<div class="container">
<p>這是一個有樣式的段落。</p>
<p>這是另一個有樣式的段落。</p>
</div>

在這個例子中，我們為 <div> 標簽添加了一個 class 屬性，并設置為 "container"。通過這個 class，我們可以在 CSS 中選擇這個 <div> 標簽，然后為其設置樣式。這樣，我們可以將這個 <div> 區塊的樣式與其他部分區分開來。
除了使用 class 屬性，我們還可以給 <div> 標簽添加 id 屬性，來對其進行唯一的標識。下面是一個使用 id 屬性的例子。

<div id="main">
<p>這是主要內容。</p>
<p>這是次要內容。</p>
</div>

在這個例子中，我們為 <div> 標簽添加了一個 id 屬性，并設置為 "main"。通過這個 id，我們可以在 JavaScript 中選擇這個 <div> 標簽，然后進行操作。比如，我們可以通過修改其樣式或內容來實現與頁面交互的效果。
除了以上的用法，<div> 標簽還可以與其他標簽組合使用，來構建更復雜的頁面結構。下面是一個案例，展示如何使用 <div> 標簽與 <header>、<nav>、<main>、<footer> 等標簽來創建一個典型的網頁布局結構。

<header>
<h1>網頁標題</h1>
</header>
<br>
<nav>
<a href="#">導航鏈接1</a>
<a href="#">導航鏈接2</a>
<a href="#">導航鏈接3</a>
</nav>
<br>
<main>
<div class="left">
<h2>左側內容</h2>
<p>這是左側部分的內容。</p>
</div>
<br>
  <div class="right">
<h2>右側內容</h2>
<p>這是右側部分的內容。</p>
</div>
</main>
<br>
<footer>
<p>版權信息</p>
</footer>

在這個例子中，我們使用 <header>、<nav>、<main> 和 <footer> 等標簽定義了網頁的不同部分，然后使用 <div> 標簽對其進行分組和布局。同時，我們也可以通過設置這些 <div> 標簽的 class 或 id 屬性，來對其應用不同的樣式或 JavaScript 功能。
通過上面的例子，我們可以看到，<div> 標簽在 HTML 中的重要性。它不僅用于劃分頁面內容和組織結構，還可以用于設置樣式和交互效果。希望本文的解釋和示例能夠幫助您更好地理解和應用 <div> 標簽。