lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
*style
>
head
>
>
>
我想把這段文字變成藍色h4
>
>
我想把這段文字背景變成黃色span
>
>
生活如此美好p
>
body
>
html
>
交集選擇器
作用：選中同時復合多個條件的元素
語法：選擇器1選擇器2選擇器3選擇器n{}
注意點：交集選擇器中如果有標籤（元素）選擇器，必須使用元素選擇器開頭
示範**：
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
span#a
h4.b
h4.c
.d.e
style
>
head
>
>
>
第一段文字，利用交集並集選擇器對其進行改變p
>
"a">
第一段文字，利用交集並集選擇器對其進行改變span
>
class
="b"
>
第二段文字，利用交集並集選擇器對其進行改變h4
>
class
="c"
>
第三段文字，利用交集並集選擇器對其進行改變h4
>
class
="c"
>
第四段文字，利用交集並集選擇器對其進行改變h4
>
class
="c d e"
>
第五段文字，利用交集並集選擇器對其進行改變h4
>
body
>
html
>
注意：id屬性是唯一的，class不是唯一的。表現如上方**所示。
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
p, #a,
.b,.c,
.d.e
style
>
head
>
>
>
第一段文字，利用交集並集選擇器對其進行改變p
>
"a">
第一段文字，利用交集並集選擇器對其進行改變span
>
class
="b"
>
第二段文字，利用交集並集選擇器對其進行改變h4
>
class
="c"
>
第三段文字，利用交集並集選擇器對其進行改變h4
>
class
="c"
>
第四段文字，利用交集並集選擇器對其進行改變h4
>
class
="c d e"
>
第五段文字，利用交集並集選擇器對其進行改變h4
>
body
>
html
>
作用：選中指定父子元素內部的指定元素
語法：父元素》子元素
作用：選中指定元素內的指定後代元素
語法：祖先 後代
語法：兄~弟
示範**：
lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
div>span
div span
div>p+h4
span~p
span~h4
style
>
head
>
>
class
="box"
>
我是乙個div。
>
我是乙個div中的span。span
>
>
我是乙個div中的p元素
>
我是p中的span。span
>
p>
>
我是div中的的h4元素。h4
>
div>
body
>
html
>
交集選擇器與並集選擇器
交集選擇器 數學中 區域一和區域二共同擁有的部分為區域三，則區域三就為區域一和區域二的交集。css中 標籤一和標籤二相同的部分就為交集選擇器。系統所找到的標籤必須滿足 既有標籤一的特點，也有標籤二的特點。系統找到的標籤為 1 標籤一 id 標籤二 或 2 標籤一 class 標籤二 或 3 標籤 i...
CSS ID選擇器 通配選擇器
id identity 是編號的意思，一般指定標籤在html文件中的唯一編號。id選擇器和標籤選擇器 類選擇器的作用範圍不同。id選擇器僅僅定義乙個對下物件的樣式，而標籤選擇器和類選擇器可以定義多個物件的樣式。id選擇器以 號作為字首，然後是乙個自定義的id名，用法如圖所示 示例 問君能有幾多愁，恰...
Css選擇器 層次選擇器（關係選擇器）
1.e f 匹配 e 元素下所有的子元素 f 後代選擇器 eg css.box a匹配 box 下所有的子元素 a 2.e f 匹配 e 元素下第一級子元素 f 子選擇器 eg css.box a匹配 box 下第一級子元素 a 3.e f 匹配 e 元素後面緊鄰的哪乙個 f 元素 有且僅有乙個 相...