个人笔记2020 5-31

伪类选择器及伪元素要点

伪类选择器和类选择器区别在于类选择器可以随意命名，而伪类选择器是CSS已经定义好的选择器，不可以随意起名。

最常见的伪类选择器

a:link{
            color: red;
        }/*未被访问的链接*/
a:visited{
            color: blue;
        }/*已被访问的链接*/
a:hover{
            color :green;
        }/*鼠标移动到链接上*/
a:active{
            color: yellow;
        }/*正在被点击的链接*/

主要的四个伪元素选择器

1.first-line选择器
2.first-letter选择器
3.before选择器
4.after选择器

结构性伪类选择器

1.root选择器：将样式绑定到页面的根元素

<style>
        :root{
            background: #126fb0;
        }
        
</style>

2.not选择器：想对某个结构元素使用样式，但不希望某个子元素出现样式，语法如下：

<style>
        :root{
            background: #126fb0;
        }
        body *:not(h1){
            background: #fff;
        }
 </style>/*下面有某个h1元素不起作用*/

3.empty选择器：指定当元素内容为空白时的样式
4.target选择器：选择器对于页面中某个target元素指定样式，用户点击了某个超链接时，样式会跳转到该元素。