<div 占用空間是指在HTML中，使用<div>標簽的元素會在頁面上占據一定的空間。這是因為<div>標簽是一個塊級元素，它有一個默認的display屬性值為“block”，會在頁面中獨占一行，在水平方向上自動填充父元素的寬度。這也是<div>標簽與<span>標簽之間的主要區別之一，<span>標簽是一個內聯元素，不會獨占一行，而是與其他元素在同一行上顯示。
下面通過幾個代碼案例來詳細解釋<div>標簽的占用空間行為。
案例1:

html
<p>This is a paragraph before the div.</p>
<div>This is a div element.</div>
<p>This is a paragraph after the div.</p>

在這個例子中，<div>標簽會在頁面中占據一行，它前后的

標簽會分別顯示在<div>的上方和下方。這是因為<div>標簽具有塊級元素的特性，會自動換行。
案例2:

html
<p>This is a paragraph before the div.</p>
<div style="display: inline;">This is an inline div element.</div>
<p>This is a paragraph after the div.</p>

在這個例子中，我們通過將<div>元素的display屬性設置為“inline”，使其變為內聯元素。雖然<div>元素的內容仍然會在頁面中占用空間，但是它不再獨占一行，而是與其他元素在同一行上顯示。
案例3:

html
<style>
.container {
width: 200px;
height: 200px;
background-color: lightgray;
}
.inner-div {
width: 100px;
height: 100px;
background-color: gray;
}
</style>
<br>
<div class="container">
<div class="inner-div"></div>
</div>

在這個例子中，我們定義了一個容器元素.container和一個內部塊級元素.inner-div。容器元素設置了固定的寬度和高度，背景色為淺灰色。內部元素設置了一半寬度和高度的尺寸，并設置了灰色背景。在頁面上，容器元素和內部元素都會占用空間，并根據給定的尺寸顯示。
以上是幾個簡單的代碼案例，展示了<div>標簽占用空間的特點。在實際的網頁設計中，我們通常會結合CSS樣式來調整<div>標簽的外觀和布局，以實現更復雜的頁面效果。同時，div占用空間的特性也使其成為劃分頁面布局的重要工具之一。