<div>和<span>是HTML標簽中常用的兩個元素，它們具有不同的作用和特性。本文將詳細介紹<div>和<span>的用法和差異，并通過幾個代碼案例進行解釋和說明。
<div>標簽是一個塊級元素，用于定義HTML文檔中的一個區域或一個容器。它可以用來包裹其他HTML元素，比如段落、圖片、表格等，將它們組織在一起形成一個整體。通過給<div>設置樣式，可以改變該區域的外觀和布局。
<span>標簽是一個內聯元素，用于定義HTML文檔中的一個短語或一小部分文本。它通常用來對文本進行樣式化操作，比如設置文字顏色、字體大小等。與<div>不同，<span>通常用于包裹少量的文字或其他內聯元素，并且不會破壞原有的文本流布局。
下面是幾個代碼案例，通過具體的例子來詳細解釋<div>和<span>的用法和區別。
例1：使用<div>組織內容

<p>以下是一些前端技術的分類：</p>
<div>
<h2>HTML</h2>
<ul>
<li>HTML5</li>
<li>XHTML</li>
<li>XML</li>
</ul>
</div>
<div>
<h2>CSS</h2>
<ul>
<li>CSS3</li>
<li>LESS</li>
<li>SASS</li>
</ul>
</div>

在這個例子中，我們使用<div>來組織頁面內容，將標題和列表包裹在不同的<div>中，可以更好地區分和組織頁面結構。
例2：使用<span>設置文字樣式

<p>請注意<span style="color: red;">這里的文字是紅色的</span>，而這里的文字則是<span style="font-weight: bold;">粗體</span>的。</p>

在這個例子中，我們使用<span>來對文字進行樣式設置。通過設置不同的CSS屬性值，可以改變文字的顏色、字體大小、字體粗細等屬性。
： <div>和<span>在HTML中扮演不同的角色和功能。<div>用于組織和布局頁面結構中的塊級元素，而<span>則用于對文本進行樣式化操作。在實際開發中，根據需要選擇合適的標簽來達到設計和開發的目的。</div></span>