元素選擇器
作用：通過(guò)元素選擇器可以選擇頁(yè)面中的所有指定元素。
語(yǔ)法：標(biāo)簽名{}
p{
color: red;
}
id選擇器
作用：通過(guò)元素的id屬性值選中唯一的一個(gè)元素。
語(yǔ)法：#id屬性值{}
#p1{
font-size: 20px;
}
類(lèi)選擇器
作用：通過(guò)元素的class屬性值選中一組元素。
語(yǔ)法：.class屬性{}
.p2{
color: red;
}
復(fù)合選擇器（交集選擇器）
作用：可以選中同時(shí)滿(mǎn)足多個(gè)選擇器的元素。
語(yǔ)法:選擇器1選擇器2選擇器N{}
不建議id選擇器使用復(fù)合選擇器
span.p3{
color: yellow;
}
選擇器分組（并集選擇器）
作用:通過(guò)選擇器分組可以同時(shí)選中多個(gè)選擇器對(duì)應(yīng)的元素。
語(yǔ)法：選擇器1，選擇器2，選擇器N{}使用逗號(hào)隔開(kāi)各個(gè)選擇器
#p1,.p2,h1{
color: yellow;
}
通配選擇器
作用：可以用來(lái)選中頁(yè)面中的所有元素。
語(yǔ)法：*{}
*{
color: red;
}
后代元素選擇器
作用：選中指定元素的指定后代元素。
語(yǔ)法：祖先元素 后代元素{}
使用空格隔開(kāi)
#d1 p span{
color: green;
}
<!--選中id為d1的div中的p元素中的span元素-->
子元素選擇器
作用：選中指定父元素的指定子元素。
語(yǔ)法：父元素 > 子元素
IE6及以下的瀏覽器不支持子元素選擇器
div > span{
color: red;
}
元素之間的關(guān)系
- 父元素：直接包含子元素的元素
- 子元素：直接被父元素包含的元素
- 祖先元素：直接或間接包含后代元素的元素，父元素也是祖先元素
- 后代元素：直接或間接被主線(xiàn)元素包含的元素，子元素也是后代元素
- 兄弟元素：擁有相同父元素的元素叫兄弟元素
