组合使用不同的选择器可以匹配更特定的元素。有的复合选择器能将目标样式应用到更多元素,有的复合选择器则会锁定更少元素,总之会让你的选择非常具体。
1、并集选择器
创建由逗号分隔的多个选择器可以将样式应用到单个选择器匹配的所有元素。
a,[lang|="en"] {
border:thin;
}
2、后代选择器
后代选择器用于选择包含在其他元素中的元素。
p span {
border:thin;
}
3、选择子元素
子代选择器跟后代选择器很像,不过只选择匹配元素中的直接后代。
body > span {
border:thin;
}
4、选择兄弟元素
使用相邻兄弟选择器可以选择紧跟在某元素之后的元素。
p + a {
border :thin;
}
使用普通兄弟选择器选择范围会稍微宽松一些,它匹配的元素在指定元素之后,但不一定相邻。
p ~ a {
border: thin;
}