在CSS中,我們可以通過類名選取元素,這十分有用。CSS類讓我們在不修改每個元素的情況下將樣式應用于許多元素。
要創建一個CSS類,我們需要在樣式表中定義它。以下是一個例子:
.my-class { background-color: blue; color: white; }
現在,我們可以將這個類應用于任何希望獲得藍色背景和白色文本的元素。我們可以通過在HTML中添加class屬性來實現這一點:
<p class="my-class">這段文本擁有藍色背景和白色字體</p>
我們甚至可以將同一個類應用于多個元素:
<p class="my-class">這段文本擁有藍色背景和白色字體</p> <div class="my-class">這個div也擁有藍色背景和白色字體</div>
注意,類名前面必須加一個點來標識它是一個類。如果想應用多個類,可以用空格分隔它們:
<p class="my-class my-other-class">這段文本擁有兩個類的樣式</p>
現在,這段文本將繼承.my-class和.my-other-class的樣式。如果需要僅應用一個類,請將另一個類從class屬性中刪除。
在CSS中選擇類比較簡單。如果想選擇一個類,只需在類名前加一個點:
.my-class { /* 樣式 */ }
此時,通過class屬性應用my-class類的元素將應用樣式。這是一個非常常見的CSS選擇器,因為它允許我們快速應用共同的樣式。