詳述CSS選擇器

2021-09-27 09:34:59 字數 1281 閱讀 7861

我們在設計網頁時常常需要設計某一標籤的屬性,為了讓**看著整潔有序,就需要將其屬性寫在這是乙個span標籤

瀏覽器為

id標籤屬性的屬性值與

id選擇器名相同的標籤元素新增

css樣式,其語法如下:

# id選擇器名
例項:

這是乙個span標籤

瀏覽器

class標籤屬性的屬性值類選擇器名相同的標籤元素新增

css樣式,其語法如下:

. 類選擇器名
注意:

class

標籤屬性的屬性值不能以

數字開頭

class

標籤屬性的屬性值可以有多個,每個值之間用

空格間隔

例項:

這是乙個span標籤

這是乙個p標籤

如果

html

文件多個

css樣式表內的部分樣式相同,則可以通過定義乙個分組選擇器以簡化

css樣式**, 該選擇器的選擇器名由多個選擇器組成,使用逗號分隔,其語法如下:

選擇器1,選擇器2,選擇器3…
例項:

這是乙個span標籤

這是乙個p標籤

後代選擇器(

descendant selector

)又稱為包含選擇器,選擇器之間用空格隔開,用於為特定的

html

子元素新增

css樣式,語法如下:

父代選擇器1 子父代選擇器2 子父代選擇器3 ….子代選擇器
例項:

第一項第二項

萬用字元選擇器

匹配html

文件中的任何

html

元素,其語法如下:

*
萬用字元選擇器常常被用來消除預設空格和換行:

海上生明月,天涯共此時。

詳述html選擇器

css 指層疊樣式表 cascading style sheets 用於設定網頁中元素的顯示方式。css的語法結構 第一種 選擇器 1 該種樣式表由選擇器以及一條或多條宣告兩個部分組成 2 該種樣式表只能定義在style標籤或css檔案中,每個style標籤或css檔案可定義多個css樣式表 第二種...

css選擇器 CSS選擇器總結

在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...

CSS選擇器 復合選擇器

選擇器 名稱 說明 css 版本 通用選擇器 選擇所有元素 2元素選擇器 選擇指定型別的元素1 id 選擇器 選擇指定 id 屬性的元素1.class 選擇器 選擇指定 class 屬性的元素 1 attr 系列 屬性選擇器 選擇指定 attr 屬性的元素 2 3 s1,s2,s3 分組選擇器 選擇...