CSS选择器

来源:互联网 发布:梦里花落知多少名句 编辑:程序博客网 时间:2024/05/10 10:30

选择器

标签选择器 tagName 
id选择器  #idname   元素的id属性
类选择器  .className  元素的class属性 所有class属性值是classname的元素
*  选择所有标签

组合选择器

后代选择器  div p 空格隔开
并集选择器  div,v 逗号隔开
交集选择器  div.className  没有间隔  
link伪类  a:link  hover active visited
子选择器  div>p >隔开  div直接子元素是p的元素

兄弟选择器

兄弟选择器  div+p  div后面直接相邻的第一个p元素
兄弟选择器  div~p  div后面同级的所有p元素


属性选择器

 [attr]  选择所有带这个属性的元素
 p[attr]  选择带attr属性的p元素
 [attr="abc"]  选择所有attr属性是abc的元素
 p[attr="abd"] 选择所有attr属性是abc的p元素
[attr*="c"]  选择所有attr属性值含有c的元素
p[attr*="c"]  选择所有attr属性值含有c的p元素
[attr^="c"]  选择所有attr属性值以c开头的元素
[attr$="c"]  选择所有attr属性值以c结尾的元素


过滤选择器

li:nth-child(3)  选择第三个li元素
li:nth-last-child(2) 选择倒数第二个li元素
li:first-child 选择第一个li元素
li:last-child 选择倒数第一个li元素
li:only-child  选择父元素只有一个子元素的li元素
0 0