伪类选择器

Posted 2020-08-15

css的伪类是用来添加一些选择器的特殊效果。

a标签用伪类的比较多,例如：

　　a:link {color:#FF0000;} /* 未访问的链接 */
　　a:visited {color:#00FF00;} /* 已访问的链接 */
　　a:hover {color:#FF00FF;} /* 鼠标划过链接 */
　　a:active {color:#0000FF;} /* 已选中的链接 */

注意：在CSS中，a:hover必须被置于a:link和a:visited之后才有效，a:active必须被置于a:hover之后

除了a标签的这些还有一些其他的，例如：

　　:not(p){}选择除了p标签之外的所有标签
　　:root根元素，等价于*{} html{}不过有优先级的区别 *>root>html
　　:empty 当元素内容为空时被选中
　　:nth-child(n)规定元素n可以是数字和倍数(2n);n+表示大于第一个元素
　　:last-child选取最后一个标签
　　:first-child选取第一个标签
　　:only-child匹配属于父元素中唯一子元素，当子元素超过一个时不起作用
　　:after 插入元素后端（必须指定content属性，转换为块状元素）
　　:before插入元素前端（必须指定content属性，转换为块状元素）