本文目錄導(dǎo)讀：

1. 元素選擇器
2. 類選擇器
3. ID選擇器
4. 屬性選擇器

CSS基礎(chǔ)選擇器及其應(yīng)用

CSS選擇器是用于選擇HTML元素并為其應(yīng)用樣式的工具，以下是CSS基礎(chǔ)選擇器的種類及其應(yīng)用方式。

元素選擇器

元素選擇器是***基本的選擇器，它根據(jù)HTML元素的標(biāo)簽名進(jìn)行選擇。p選擇器會(huì)選擇所有的段落元素。

應(yīng)用方式：

p {
  color: red;
}

代碼會(huì)將所有段落的文字顏色設(shè)為紅色。

類選擇器

類選擇器通過(guò)以.開(kāi)頭并跟隨類名來(lái)選擇元素。.myClass會(huì)選擇所有帶有class="myClass"屬性的元素。

應(yīng)用方式：

.myClass {
  background-color: yellow;
}

代碼會(huì)將所有帶有class="myClass"的元素的背景顏色設(shè)為黃色。

ID選擇器

ID選擇器以#開(kāi)頭并跟隨特定的ID名稱來(lái)選擇***的元素。#myID會(huì)選擇帶有id="myID"屬性的元素。

應(yīng)用方式：

#myID {
  font-size: 20px;
}

代碼會(huì)將ID為myID的元素的字體大小設(shè)為20像素。

屬性選擇器

屬性選擇器用于選擇具有指定屬性的元素。[type="text"]會(huì)選擇所有類型為“text”的輸入元素。

應(yīng)用方式：

input[type="text"] {
  width: 200px;
}

代碼會(huì)將所有類型為“text”的輸入元素的寬度設(shè)為200像素。

就是CSS基礎(chǔ)選擇器的種類及其應(yīng)用方式，這些選擇器可以單獨(dú)使用，也可以組合使用，以創(chuàng)建更復(fù)雜的樣式規(guī)則，理解并熟練掌握這些基礎(chǔ)選擇器，是CSS布局和樣式設(shè)計(jì)的基礎(chǔ)。