E F 包含选择器 包括孙子辈的
E>F 子选择器 不包括孙子辈的
E+F 相邻选择器
E~F 兄弟选择器
<!--注意:兄弟选择器选中的是【E标签之后】的所有兄弟F-->
选中E出现的后面的兄弟
<style>
p~p{color:#f00;}
</style>
<div><!--该div是父元素-->
<p>中国十大杰出人物</p>
<p>①别人家的孩子</p>
<p>②别人家的爸爸</p>
<p>③别人家的妈妈</p>
<p>④别人家的老公</p>
<p>⑤别人家的老婆</p>
<p>⑥别人家的公公</p>
<p>⑦别人家的婆婆</p>
<p>⑧别人家的公司</p>
<p>⑨别人家的领到</p>
<p>⑩别人家的员工</p>
</div>
伪类选择器
E:link
E:visited
E:hover
E:active
E:focus
E:first
E:last
E:nth-child(){}
li:nth-child(2){}:找到li父亲的第二个元素,并且第二个元素必须是li,否则无效
li:nth-child(odd) {} odd奇数 even偶数
li:nth-child(3n+1){} 自定义序列 (n从0自增1)
E:nth-last-child(){} 倒叙方式
E:only-only-child{ } 父元素的唯一子元素,独生子
E:first-of-type{} 先过滤掉不符合E的元素,再排序
E:last-of-type{}
E:nth-of-type(){}
E:only-of-type(){}如果不是独生子就不会选中了
属性选择器
E[att] 如果有
E[att='val']
E[att~='val']
E[att|='val']
伪对象选择器
E:first-letter
E:first-line
E:before
E:after