一.结构伪类选择器
通过某种结构关系去查找页面元素 例如匹配某个元素的第一个子元素。 用于选择第几个要设置伪类的元素
div：nth-child（2）{} 表示选择偶数的元素
div：nth-child（2n/even）{} 表示选择奇数的元素
div：nth-child（2n-1/odd）{} 表示选择只有一个该此节点的元素，若该div下有两个p标签则不选择
div p：only-child）{} 表示选择标签内没有任何内容的的元素，包括空格和换行符
div：empty{} 在伪类选择器中可以用==:root==代替html 部分演示代码如下：
二.目标伪类选择器
与锚点结合使用。 E：target选择匹配元素E的所有元素，且匹配元素被相关URL指向
/* 使得目标伪类的样式单独的改变，点哪改哪 */
div:target{
background-color: bisque;
}
用target实现简单手风琴案例
三.UI元素状态选择器
E:enabled匹配所有用户界面（form表单）中处于可用状态的E元素 E:disabled匹配所有用户界面（form表单）中处于不可用状态的E元素 E:checked匹配所有用户界面（form表单）中处于选中状态的E元素 E:selection匹配E元素中被用户选中或处于高亮部分
四.否定伪类选择器
E:not(s) 表示不是偶数个都设置该样式
div:not(nth-child(2){}
五.其他选择器
E:link ：链接伪类选择器，未被访问过的超链接 E:visited：链接伪类选择器，已被访问过的超链接 E:active：用户行为选择器，鼠标点击时的效果 E:hover：用户行为选择器，鼠标停留时的效果
好文链接
发表评论