\

在CSS中，可以使用classname來為HTML元素添加樣式。classname是一個由開發者定義的名稱，用于標識某個特定的樣式。

\

通過在HTML元素的class屬性中指定classname，可以讓CSS選擇器選擇到對應的元素并應用樣式。這種方式非常靈活，可以為不同的元素添加相同的樣式，或為同一個元素添加不同的樣式。

\

下面通過幾個代碼案例詳細解釋說明classname的使用：

\

案例一：

\

，在HTML中定義一個class為"red"的div元素，如下所示：

\

<code>
\<div class="red">Hello World\</div>
\</code>
\

\

然后，在CSS中定義名為"red"的classname，并指定對應的樣式，如下所示：

\

<code>
.red {
color: red;
}
\</code>
\

\

這樣，這個div元素的文本內容將被渲染成紅色。

\

案例二：

\

在HTML中可以同時給一個元素指定多個classname，每個classname之間用空格分隔。這樣可以方便地組合不同的樣式。

\

比如，我們為一個div元素指定了兩個classname，一個為"red"，一個為"bold"：

\

<code>
\<div class="red bold">Hello World\</div>
\</code>
\

\

然后，在CSS中分別定義這兩個classname的樣式，如下所示：

\

<code>
.red {
color: red;
}
<br>
  .bold {
font-weight: bold;
}
\</code>
\

\

這樣，這個div元素的文本內容將被渲染成紅色，并且加粗顯示。

\

案例三：

\

classname不僅可以應用于div元素，還可以應用于其他各種HTML元素。

\

比如，我們可以為一個p元素添加名為"highlight"的classname：

\

<code>
\<p class="highlight">This is a highlighted paragraph.\</p>
\</code>
\

\

然后，在CSS中定義名為"highlight"的classname的樣式，如下所示：

\

<code>
.highlight {
background-color: yellow;
}
\</code>
\

\

這樣，這個p元素的背景顏色將變成黃色，從而實現了文本的高亮效果。

\

通過以上幾個案例，我們可以看到classname在CSS中的強大應用。它可以精確選擇元素，并為之添加樣式，使得網頁的布局和樣式更加靈活多樣。