<div> 標簽是 HTML 中最常用的一個標簽，它用于定義網頁中的一個區域或容器。根據默認的設置，<div> 元素的高度是由其包含的內容決定的。換句話說，<div> 的高度會自動適應其內部內容的高度。這意味著，如果有一段文字或一張圖片放在 <div> 中，<div> 的高度會自動根據該段文字或圖片的高度進行調整。
現在讓我們通過幾個代碼案例來詳細解釋說明 "div 自動高" 的概念。
案例一：純文本內容的 <div> 假設我們有以下代碼：

<code>
<div>
<p>這是一段簡單的文字。</p>
<p>這是另一段文字。</p>
</div>
</code>

在這個例子中，<div> 包含了兩個

標簽，每個

標簽里面都有一段文字。由于 <div> 的高度會根據其內部內容的高度進行調整，所以這個 <div> 的高度會根據兩段文字的高度進行自動調整。
案例二：包含圖片的 <div> 假設我們有以下代碼：

<code>
<div>
<img src="image.jpg" alt="一張圖片">
</div>
</code>

在這個例子中，<div> 包含了一個 <img> 標簽，該標簽引用了一張圖片。同樣地，<div> 的高度會根據圖片的高度進行自動調整。
案例三：混合內容的 <div> 假設我們有以下代碼：

<code>
<div>
<img src="image.jpg" alt="一張圖片">
<p>這是一段簡單的文字。</p>
</div>
</code>

在這個例子中，<div> 同時包含了一個 <img> 標簽和一個

標簽。根據默認的設置，<div> 的高度會根據其中最高的元素的高度進行自動調整。因此，在這個例子中，<div> 的高度會根據圖片的高度進行自動調整。
：<div> 元素的高度會自動適應其內部內容的高度。它是一個非常靈活的標簽，可用于創建各種不同類型的容器。無論包含的內容是純文本、圖片，還是混合內容，<div> 都會根據其中最高的元素的高度進行自動調整。這個特性使得我們能夠輕松地創建出符合需求的網頁布局。