<div> 在 CSS 中是一個非常重要且常用的標簽。它可以用于將 HTML 文檔的內容分隔開，以實現更好的結構與樣式的管理。然而，當在 CSS 中進行深度選擇時，<div> 標簽可以發揮更多的作用。本文將詳細介紹如何使用 CSS 的 <div> 標簽進行深度選擇，以及提供一些實例來進一步說明其用法。

深度選擇：

CSS 的深度選擇是指通過 CSS 選擇器和層級關系來選擇 HTML 元素。通過 <div> 標簽的嵌套關系以及 CSS 選擇器的組合使用，我們可以針對特定元素進行樣式定義。下面是一些實例，以幫助我們理解深度選擇的用法。

案例一：

<code>
<style>
.parent .child {
color: red;
}
</style>
<br>
<div class="parent">
<p>父元素</p>
<div class="child">
<p>子元素1</p>
</div>
<div class="child">
<p>子元素2</p>
</div>
</div>
</code>

在這個例子中，我們定義了一個.parent .child的 CSS 選擇器，它表示選取.parent元素內部的所有.child元素。在 CSS 中，我們將.parent .child放入一個樣式塊中，并設置文本顏色為紅色。當應用到上面的 HTML 代碼時，我們會發現所有的.child元素的文本顏色都變為紅色。

案例二：

<code>
<style>
div div div {
background-color: yellow;
}
</style>
<br>
<div>
<div>
<div>
<p>要素</p>
</div>
</div>
</div>
</code>

在這個例子中，我們定義了一個div div div的 CSS 選擇器，它表示選取div元素的三級子元素。在 CSS 中，我們將這個選擇器放入一個樣式塊中，并設置背景顏色為黃色。當應用到上面的 HTML 代碼時，我們會發現所有滿足條件的div元素都具有黃色的背景顏色。

案例三：

<code>
<style>
.parent .child {
font-size: 20px;
}
<br>
    .parent .child .grandchild {
font-weight: bold;
}
</style>
<br>
<div class="parent">
<div class="child">
<p>字體大小為 20px</p>
<div class="grandchild">
<p>字體加粗</p>
</div>
</div>
</div>
</code>

這個例子中，我們定義了兩個 CSS 選擇器。，我們將樣式塊內的.parent .child選擇器用于設置字體大小為 20 像素的.child元素。接著，我們使用.parent .child .grandchild選擇器來設置字體加粗樣式。當應用到上面的 HTML 代碼時，我們會發現.child元素具有 20 像素的字體大小，并且.grandchild元素具有加粗的字體樣式。

通過以上幾個案例，我們可以清楚地看到，通過深度選擇，我們可以根據 HTML 元素的層級關系和 CSS 選擇器的組合使用，方便地定義樣式。深度選擇在實際開發中也可以有效地提高樣式管理的靈活性和可擴展性。希望這篇文章對你理解和使用 CSS 的 <div> 標簽進行深度選擇提供了一些幫助。