CSS3——新增的选择器

CSS3——新增的选择器

CSS3新增的三个模块 

CSS3——新增的选择器

CSS3——新增的选择器

关系选择器

E+F

下一个满足条件的兄弟元素节点

CSS3——新增的选择器

E~F

并列结构下满足条件的兄弟元素节点

 CSS3——新增的选择器

属性选择器

E[attr~="val"]

CSS3——新增的选择器

E[attr |="val"]

CSS3——新增的选择器

E[attr^="val"]

CSS3——新增的选择器

E[attr$="val"]

CSS3——新增的选择器

E[attr*="val"]

  CSS3——新增的选择器

伪元素选择器

E::placeholder

CSS3——新增的选择器

E::selection

CSS3——新增的选择器

效果

CSS3——新增的选择器

伪类选择器

描述:被选中的元素一种状态

E:not(s)

真实应用于为ul下面的li添加下线,最后一个不添加。不会出现线重叠

CSS3——新增的选择器

CSS3——新增的选择器

E:root

CSS3——新增的选择器

 E:target

被标记成锚点之后,哪个标签的被标记了,就会变成target 

CSS3——新增的选择器

点击效果

CSS3——新增的选择器

E:first-child

CSS3——新增的选择器

E:last-child

 CSS3——新增的选择器

 

E:only-child

 CSS3——新增的选择器

E:nth-child(n)

 CSS3——新增的选择器

E:nth-last-child(n)

 CSS3——新增的选择器

E:first-of-type

 CSS3——新增的选择器

E:last-of-type

 CSS3——新增的选择器

E:only-of-type

 CSS3——新增的选择器

E:nth-of-type(n)

 CSS3——新增的选择器

E:nth-of-last-type(n)

 跟nth-of-type倒着查,方法同上

E:empty

 CSS3——新增的选择器

E:checked

 CSS3——新增的选择器

未点击状态

CSS3——新增的选择器

点击后状态

 CSS3——新增的选择器

E:enabled

 CSS3——新增的选择器

 CSS3——新增的选择器

E:disabled

 CSS3——新增的选择器

CSS3——新增的选择器

E:read-only

 CSS3——新增的选择器

E:read-write

 就是可以选中没有设置readonly的input