css3选择器

css3选择器
E F//E下的所有元素F
E>F//E下的子元素元素F不包含孙子
E+F//E元素后面的兄弟元素F
E~F//E的兄弟元素F只能选中E元素后面的兄弟元素
p:first-child{}//找到p元素的父亲元素看他第一个子元素是否是p元


素
p:last-child
li:nth-child(2)//找到li的父元素看他的第二个子元素是不是li
li:nth-child(even)偶数
li:nth-child(odd)奇数
li:nth-child(3n+2)
li:nth-last-child()//倒叙
li:only-child{}//找到li元素的父亲元素如果他的父元素只有一个子


元素并且子元素是li
p:first-of-type{}//找到p元素的父元素下的第一个出现的子元素p
其他用法同上
表单选择器
input:enabled/disabled
input:checked
属性选择器
p[width]{}//带有width属性的p标签
p[id="green"]//id属性值为green的标签
p[class~=f2]//属性值为f2且中间有空格 如class="f1 f2"
p[class|="b"]//要求以b开头并且以—分隔


E[att^="值"]选中以指定值开头的元素
E[att$="值"]选中以指定值结尾的元素
E[att*="值"]选中包含指定值的元素
伪类 E:hover E:activity
伪对象 E::first-letter  E第一个字符的样式
注意：该属性需要和over-flow：hidden属性（超出处理）
还有white-space:nowrap(禁止换行）配合使用，否则无法看到效果。
 p::first-line{}//选中p标签内容的第一行
 a::before/after{content:}在a标签当前内容前后添加内容
a[href$="txt"]::before{content:url(images/txt.jpg)}
span::selection{}//鼠标选中的元素