在實際應用中，不會像上節中所有段落都要是紅色的，如果僅希望一部分段落是紅色的，另一部分段落是藍色的，該怎么做呢？這就需要用到類別選擇器。用戶可以自由定義類別選擇器名稱，但也必須遵守CSS的3個要素。下面的例子就通過類別選擇器更改第3和第4個P標簽文字為藍色。

(1)新建實例文件02-02.html，代碼如下，其中選擇器P定義了所有段落顯示樣式，選擇器blue定義了部分字體顯示樣式，即顯示顏色為藍色。

(2)按【F12】鍵運行，結果如下圖所示：

通過本例我們可以看到，類別選擇器與標記選擇器在定義上幾乎是一樣的，僅需要自己定義一個名稱，在需要使用的地方通過“class=類別選擇器名稱”就能靈活使用。

類別選擇器還有一個特定，就是它可以用在不同標簽元素上，下面的例子就是類別選擇器分別作用于P標簽和h標簽上。h標簽是HTML用于定義標題樣式的標記。

(1)新建文件02-03.html，輸入如下代碼，創建一個blue類別選擇器，定義了字體顯示大小、字體顏色和字體加粗。在下面的HTML頁面中，段落和標題都引用了這個樣式，即表示標題和段落顯示同一個樣式。

(2)按【F12】鍵運行，結果如下圖所示：

類別選擇器的使用是很靈活的，可以在一個標記中使用多個類別選擇器，達到復合使用的效果，實例如下：

(1)新建02-04.html，輸入如下代碼，這里創建了兩個類別選擇器，其中red選擇器定義了字體顏色，big選擇器定義了字體大小。在HTML頁面中，第三個段落同時使用了red和big兩個選擇器。

(2)按【F12】鍵運行，結果如下圖所示：

從運行結果中我們可以看到，在第一行沒有使用任何類別選擇器，第二行使用了red選擇器，文字顏色變為紅色，第三行使用big選擇器，改變了字體的大小，第四行同時使用red和big選擇器，文字的顏色和字體的大小同時發生了改變。

注意：本例僅同時使用顏色和大小兩種類別選擇器，實際開發中可以同時使用多個選擇權器。

總結

以上是生活随笔為你收集整理的类别选择器在HTML中如何表示,CSS类别选择器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。