<div>函數是HTML中的一個標簽，用來定義文檔中的一個區域。當我們需要將頁面內容進行分割或者進行樣式設置時，可以使用<div>標簽。它是一個容器標簽，可以包含其他HTML元素，并且可以利用CSS對其進行樣式設置。
下面是幾個關于<div>函數使用的示例，用來詳細說明它的用法和效果。
第一個示例是一個簡單的<div>函數的使用示例。在下面的代碼中，我們使用<div>函數創建了一個包含文本的區域，并且為該區域設置了背景顏色和邊框。

<p><div style="background-color: #f2f2f2; border: 1px solid #ccc;"></p>
<p>    <p>這是一個簡單的示例</p></p>
<p></div></p>

在上述代碼中，我們使用style屬性來為<div>元素設置樣式。其中background-color屬性設置了背景顏色為淺灰色（#f2f2f2），border屬性設置了邊框為1像素的灰色實線。

標簽則是用于在<div>區域內添加文本。
下面是第二個示例，我們使用<div>函數來設置多個元素的樣式。

<p><div style="background-color: #f2f2f2; border: 1px solid #ccc;"></p>
<p>    <h1>標題</h1></p>
<p>    <p>這是一個段落</p></p>
<p>    <ul></p>
<p>       <li>列表項1</li></p>
<p>       <li>列表項2</li></p>
<p>   </ul></p>
<p></div></p>

在上述代碼中，我們使用<div>函數來包含了一個<h1>標題</h1>元素、一個段落元素和一個無序列表。這樣，我們就可以為這些元素同時設置樣式，比如設置它們的背景顏色和邊框。
<div>函數的使用不僅限于HTML標簽，也可以用于CSS和JavaScript代碼的區域劃分。下面是一個示例，展示了如何使用<div>函數在CSS樣式表中定義一個區域。

<p><style></p>
<p>.container {</p>
<p>     width: 200px;</p>
<p>     height: 200px;</p>
<p>     background-color: #f2f2f2;</p>
<p>     border: 1px solid #ccc;</p>
<p>}</style></p>
<p><div class="container"></p>
<p>    <p>這是一個CSS區域的示例</p></p>
<p></div></p>

在上述代碼中，我們使用<div>函數創建了一個CSS區域，并使用class屬性指定了該區域的類名為"container"。同時，在<style>標簽內定義了.container的樣式，包括了寬度、高度、背景顏色和邊框樣式。這樣，我們就可以在頁面中使用<div class="container">來應用這些樣式，并在<div>區域內添加自己的內容。
起來，<div>函數在HTML中是一個非常常用的標簽，用于劃分頁面的不同區域，并且可以利用CSS對其進行樣式設置。它的靈活性讓我們可以根據自己的需求自由調整和組織頁面的結構。無論是用來包含文本、元素還是代碼區域，<div>函數都是一個強大的工具，幫助我們創建出美觀、有層次感的網頁。