CSS之選擇器

2021-08-20 21:56:31 字數 1926 閱讀 4004

一:基本選擇器

選擇器型別

功能描述

*通配選擇器 

選擇文件中所以html元素

e元素選擇器

選擇指定型別的html元素

#idid選擇器

選擇指定id屬性值為「id」的任意型別元素

.class

類選擇器

選擇指定class屬性值為「class」的任意型別的任意多個元素

selector1,selectorn

群組選擇器

將每乙個選擇器匹配的元素集合並

1.元素選擇器(選中所有div標籤)

天若有情天亦老,看見哈特蒙一腳!01

天若有情天亦老,看見哈特蒙一腳!02

天若有情天亦老,看見哈特蒙一腳!03

天若有情天亦老,看見哈特蒙一腳!04

2.類選擇器(選中所有相同類名的div標籤)

天若有情天亦老,看見哈特蒙一腳!01

天若有情天亦老,看見哈特蒙一腳!02

天若有情天亦老,看見哈特蒙一腳!03

天若有情天亦老,看見哈特蒙一腳!04

3.id選擇器(選中某個id名的div標籤)

天若有情天亦老,看見哈特蒙一腳!01

天若有情天亦老,看見哈特蒙一腳!02

天若有情天亦老,看見哈特蒙一腳!03

天若有情天亦老,看見哈特蒙一腳!04

二:層級選擇器

選擇器型別

功能描述

e  f

後代選擇器(包含選擇器)

選擇匹配的f元素,且匹配的f元素被包含在匹配的e元素內

e>f

子選擇器

選擇匹配的f元素,且匹配的f元素所匹配的e元素的子元素

e+f相鄰兄弟選擇器

選擇匹配的f元素,且匹配的f元素緊位於匹配的e元素的後面

e~f通用選擇器

選擇匹配的f元素,且位於匹配的e元素後的所有匹配的f元素

天若有情天亦老,看見哈特蒙一腳!01

天若有情天亦老,看見哈特蒙一腳!02

天若有情天亦老,看見哈特蒙一腳!03

天若有情天亦老,看見哈特蒙一腳!04

三:屬性選擇器

選擇器功能描述

[attribute]

用於選取帶有指定屬性的元素。

[attribute=value]

用於選取帶有指定屬性和值的元素。

[attribute~=value]

用於選取屬性值中包含指定詞彙的元素。

[attribute|=value]

用於選取帶有以指定值開頭的屬性值的元素,該值必須是整個單詞。

[attribute^=value]

匹配屬性值以指定值開頭的每個元素。

[attribute$=value]

匹配屬性值以指定值結尾的每個元素。

[attribute*=value]

匹配屬性值中包含指定值的每個元素。

使用者名稱:

密碼:

JQuery選擇器之CSS選擇器

語法描述 選擇所有元素 選擇特定型別的元素 選擇具有特定class的元素 選擇具有特定class的某類元素 id 選擇具有特定id屬性值的元素 語法描述 attr 選取定義了attr屬性的元素,即使這個屬性值為空 attr val 選擇attr屬性值等於字串val的元素 attr val 選擇att...

CSS選擇器之基礎選擇器

選擇器 選擇符 就是根據不同需求把不同的標籤選出來這就是選擇器的作用。簡單來說,就是選擇標籤用的。標籤選擇器 又稱元素選擇器,指用html標籤作為選擇器,為頁面中某類標籤設定css樣式。缺點 不能差異化設定樣式,只能選擇全部的當前標籤。語法 基礎選擇器之標籤選擇器title 標籤選擇器 寫上標籤名 ...

CSS 選擇器之基礎選擇器

id選擇器 選擇具體的id屬性值的元素 元素選擇器 選擇具有相同標籤名稱的元素 類選擇器 選擇具有相同的class屬性值的元素。id選擇器,是根據標籤的id屬性值選擇對應的標籤的。格式 id值舉例 定義兩個p標籤,且標籤的id屬性值不同,然後用css定義p標籤的內容如何顯示。google瀏覽器中開啟...