div 寬度沒用
div 是 HTML 中最常用的標簽之一，它用于創建一個塊級容器，用于包含其他元素。在默認情況下，div 的寬度是由其內容決定的，而不受任何樣式屬性的影響。這就是為什么有時候會遇到 div 的寬度沒有起作用的情況。
在討論這個問題之前，我們先來了解一下 div 的寬度是如何計算的。在 HTML 中，每個元素都有兩個基本屬性：內聯（inline）和塊級（block）。內聯元素會自動占據其內容所需的空間，而塊級元素則會獨占一行，并可以通過設置寬度來控制其水平方向上的空間占用。
然而，雖然 div 是一個塊級元素，但是它的寬度默認是由其內容撐開的。這意味著無論我們是否明確設置了 div 的寬度，它都會自動根據其內部內容的寬度進行自適應。如果我們想要改變 div 的寬度，我們需要使用 CSS 來控制。
下面，我們通過幾個代碼案例來詳細解釋 div 寬度沒用的問題。
案例一：使用 width 屬性

我們可以通過設置 div 的 width 屬性來改變其寬度。在下面的示例中，我們設置 div 的寬度為200像素，并將其背景顏色設置為紅色。

<style>
.red-div {
width: 200px;
background-color: red;
}
</style>
<br>
<div class="red-div">
This is a div with a width of 200px.
</div>

在上面的示例中，我們明確設置了 div 的寬度為200像素，所以它跨越了整個屏幕，背景顏色為紅色。
案例二：使用 max-width 屬性

除了使用 width 屬性來設置 div 的寬度，我們還可以使用 max-width 屬性來限制 div 的最大寬度。在下面的示例中，我們將 div 的最大寬度設置為300像素，并將其背景顏色設置為藍色。

<style>
.blue-div {
max-width: 300px;
background-color: blue;
}
</style>
<br>
<div class="blue-div">
This is a div with a maximum width of 300px.
</div>

在上面的示例中，我們將 div 的最大寬度設置為300像素。即使內容超過300像素，div 的寬度也不會超過設定的最大寬度，背景顏色為藍色。
案例三：使用百分比

除了使用像素單位外，我們還可以使用百分比來設置 div 的寬度。在下面的示例中，我們將 div 的寬度設置為50%。

<style>
.percentage-div {
width: 50%;
background-color: green;
}
</style>
<br>
<div class="percentage-div">
This is a div with a width of 50%.
</div>

在上面的示例中，我們將 div 的寬度設置為50%。這意味著 div 的寬度將自動根據父元素的寬度進行計算，并占據父元素寬度的一半，背景顏色為綠色。
<div>標簽作為 HTML 中最常用的標簽之一，其寬度在默認情況下是由其內容撐開的。然而，我們可以通過設置 width、max-width 或使用百分比來改變 div 的寬度。這些方法可以使我們更好地控制 div 寬度，確保其適應我們的設計需求。