CSS充滿<div>是指將一個元素的背景色、邊框和內邊距（padding）擴展到其父元素的邊緣，使其填滿整個父元素的空間。通過一些簡單的CSS代碼，我們可以很容易地實現這一效果。下面我將用幾個代碼案例詳細解釋說明。

案例1：使用百分比高度實現充滿效果

<code>
<p><div class="parent"></p>
<p>  <div class="child">CSS充滿div</div></p>
<p></div></p>
</code>

<code>
<p>.parent {</p>
<p>  background-color: blue;</p>
<p>  height: 300px;</p>
<p>}</p>
<p>.child {</p>
<p>  background-color: red;</p>
<p>  height: 100%;</p>
<p>}</p>
</code>

在這個案例中，通過給父元素設置一個固定高度（300px），并將子元素的高度設置為100%，子元素就能夠充滿父元素的空間了。這樣，子元素的背景色會充滿整個父元素，并且在任何情況下都會保持適當的填充。

案例2：使用絕對定位實現充滿效果

<code>
<p><div class="parent"></p>
<p>  <div class="child">CSS充滿div</div></p>
<p></div></p>
</code>

<code>
<p>.parent {</p>
<p>  background-color: blue;</p>
<p>  width: 300px;</p>
<p>  height: 300px;</p>
<p>  position: relative;</p>
<p>}</p>
<p>.child {</p>
<p>  background-color: red;</p>
<p>  width: 100%;</p>
<p>  height: 100%;</p>
<p>  position: absolute;</p>
<p>  top: 0;</p>
<p>  left: 0;</p>
<p>}</p>
</code>

在這個案例中，我們通過將父元素的定位設置為相對（relative）以及子元素的定位設置為絕對（absolute），并將子元素的寬度和高度都設置為100%，使子元素完全覆蓋父元素。這樣，子元素就能夠充滿父元素的空間。

案例3：使用彈性布局實現充滿效果

<code>
<p><div class="parent"></p>
<p>  <div class="child">CSS充滿div</div></p>
<p></div></p>
</code>

<code>
<p>.parent {</p>
<p>  background-color: blue;</p>
<p>  display: flex;</p>
<p>  height: 300px;</p>
<p>}</p>
<p>.child {</p>
<p>  background-color: red;</p>
<p>  flex: 1;</p>
<p>}</p>
</code>

在這個案例中，我們通過將父元素的display屬性設置為flex，并給子元素的flex屬性設置為1，使子元素自動填充父元素的剩余空間。這樣，子元素就能夠充滿父元素的空間，并且隨著父元素的尺寸變化而自動調整。

以上是三個實現CSS充滿<div>的案例。無論是使用百分比高度、絕對定位還是彈性布局，我們都可以輕松實現元素充滿父元素的效果。這個技巧在Web開發中非常有用，可以幫助我們創建各種各樣的布局和設計效果。