# 2.CSS3选择器
- 新增的选择器
1. 关系选择器
E+F:下一个满足条件的兄弟元素节点
E~F:与E元素同级的所有F元素节点
2. 属性选择器
E[attr~='val']:attr属性中存在一个独立的val值
E[attr|='val']:attr属性中val开头或val-开头的
E[attr^='val']:attr属性中val开头
E[attr$='val']:attr属性中val结尾
E[attr*='val']:attr属性存在val值
3. 伪元素选择器
//文本框中提示信息
E::placeholder{//只能设置下面一个属性
color:#ccc;
}
//选中后的效果
E::selection{//只能设置下面三个属性
color:#ccc;
text-shadow:1px 2px black;
}
4. 伪类选择器：被选中元素的一种状态
E:not(.demo) class!='demo'的E元素
:root 根标签选择器。在HTML里，选择html节点
E:target 目标元素，多用于锚点
----下面都要考虑其他同级元素，所以用的不多。是所有子元素
E:first-child 子元素中第一个元素且是E元素
E:last-child 子元素中最后一个元素且是E元素
E:only-child 子元素中只有一个元素且是E元素
E:nth-child(n) 子元素中第n个元素且是E元素
E:nth-last-child(n) 子元素中倒数第n个元素且是E元素
----上面都要考虑其他同级元素，所以用的不多
----下面不考虑其他同级元素，只考虑匹配的元素
E:first-of-type 子元素中第一个E元素
E:last-of-type 子元素中最后一个E元素
E:only-of-type 子元素中只有一个E元素
E:nth-of-type(n) 子元素中第n个E元素素
E:nth-of-last-type(n) 子元素中倒数第n个E元素
----上面不考虑其他同级元素，只考虑匹配的元素
E:empty E元素中什么节点都没有（可以有注释）
E:checked 被选中的E元素
E:enabled 可以使用的E元素
E:disabled 带有disabled属性的E元素
E:read-only 带有readonly属性的E元素
E:read-write 带有readwrite属性的E元素