<div>元素是HTML中的一個常用元素，它被用來創建網頁的不同部分，比如導航欄、段落、圖片等。在HTML中，<div>元素是一個容器，可以用來組織和布局其他HTML元素。通過CSS樣式，我們可以對<div>元素進行各種樣式的控制，包括寬度。本文將詳細介紹如何使用<div>元素來查看寬度，以及一些實例解釋。
，我們來看一個簡單的例子。假設我們有一個<div>元素，其中包含一段文本。我們想要了解這個<div>元素的寬度。通過CSS樣式，我們可以對<div>元素設置一個固定的寬度，并將其用于布局其他元素。
下面是一個示例代碼：

<div style="width: 200px; background-color: yellow;">
這是一個示例<div>元素
</div>

在上面的例子中，我們使用了style屬性來設置<div>元素的樣式。其中，width屬性用來設置寬度為200像素，background-color屬性用來設置背景顏色為黃色。這樣，我們就可以清楚地看到<div>元素的寬度為200像素。
<div>元素的寬度也可以通過CSS類來設置。我們可以在CSS文件中定義一個名為example的類，并將其應用于<div>元素上。
下面是一個示例代碼：

<style>
.example {
width: 300px;
background-color: lightblue;
}
</style>
<br>
<div class="example">
這是一個示例<div>元素
</div>

在上面的例子中，我們通過<style>標簽定義了一個名為example的CSS類，在這個類中，我們設置了寬度為300像素，背景顏色為淺藍色。然后，我們將該類應用于<div>元素上，這樣我們就可以看到<div>元素的寬度為300像素。
除了固定寬度，<div>元素的寬度還可以根據父元素的寬度自動調整。這可以通過CSS中的百分比單位來實現。設置<div>元素的寬度為百分比值，相對于其父元素的寬度。
下面是一個示例代碼：

<div style="width: 50%; background-color: lightgreen;">
這是一個示例<div>元素
</div>

在上面的例子中，我們將<div>元素的寬度設置為50%，這意味著它將占據父元素寬度的一半。背景顏色被設置為淺綠色，以便更清楚地看到<div>元素的寬度。
總之，通過使用<div>元素和CSS樣式，我們可以輕松控制元素的寬度。通過設置固定寬度、使用CSS類或百分比值，我們可以靈活地布局網頁中的不同部分。希望本文的示例能幫助你更好地理解<div>元素的寬度查看。