CSS的高级选择器

97 阅读1分钟

层次选择器

后代选择器:

image.png

  • 匹配所有被包含在祖先元素中的后代元素
  • 两个选择器之间必须要以空格隔开,中间不能有任何其他的符号插入 子选择器:

image.png

  • 只匹配所选元素的子元素 相邻兄弟选择器:

image.png image.png

  • 只会匹配所选元素的下一个兄弟元素

通用兄弟选择器:

image.png

  • 匹配所选元素后的所有兄弟元素

属性选择器

E[attr]:选择匹配具有属性attr的E元素

image.png

E[attr=val]:选择匹配具有属性attr的E元素,并且属性值为val

image.png

E[attr^=val]:选择匹配元素E,且E元素定义了属性attr,其属性值是以val开头的任意字符串

image.png

E[attr$=val]:选择匹配元素E,且E元素定义了属性attr,其属性值是以val结尾的任意字符串

image.png

E[attr*=val]:选择匹配元素E,且E元素定义了属性attr,其属性值包含了“val”

image.png