a元素的伪类、伪元素选择器、选择器权重

最新推荐文章于 2023-04-04 13:25:13 发布

吱吱吱-

最新推荐文章于 2023-04-04 13:25:13 发布

阅读量115

点赞数

文章标签： css html 前端

本文链接：https://blog.csdn.net/m0_73970213/article/details/129249235

版权

<!-- 一、a元素的伪类

:link 未访问的链接

：visted 访问过的链接

：active 鼠标点击后的状态

：hover 鼠标悬停的状态

其中link和visted是a元素特有的

-->

<!-- 二、伪元素选择器

1、：：first-letter 第一个字母

2、：：first-line 第一行

3、：：before 在元素之前

4、：：after 在元素之后

5、：：selection 选中的内容

其中before和after要与content属性一起使用

-->

<!--

三、样式的继承

我们为祖先元素设置样式，也会应用到我们的后代元素上

优点；便于开发

并不是所有样式都会被继承，像背景相关、布局相关就不会

-->

<!--

四、选择器的权重

@important 最高级（VIP）慎用可以用来检测选择器优先级，或者修改插件样式

内联样式>id>class、属性>元素>通配

继承样式没有权重

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* a:visited {
            color: pink;
        } */

        /* a:hover{
            background-color: brown;
        } */

        /* a:link{
            color: blueviolet;
        } */
/* 
        p::after{
            content: "你好";
        } */

       ::selection{

        color: red;

        }


    </style>
</head>

<body>

    <p>
        <a href="#">不德种们苦降杨罚司属身水德以貂，己接过。</a>
    </p>
    <p>
        <a href="#">不德种们苦降杨罚司属身水德以貂，己接过。</a>
    </p>

    <p><a href="#">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Deserunt, fugit.</a></p>
</body>

</html>

吱吱吱-

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
a元素的伪类、伪元素选择器、选择器权重

并不是所有样式都会被继承，像背景相关、布局相关就不会。我们为祖先元素设置样式，也会应用到我们的后代元素上。1、：：first-letter 第一个字母。内联样式>id>class、属性>元素>通配。其中link和visted是a元素特有的。5、：：selection 选中的内容。2、：：first-line 第一行。：active 鼠标点击后的状态。3、：：before 在元素之前。4、：：after 在元素之后。：visted 访问过的链接。：hover 鼠标悬停的状态。-- 二、伪元素选择器。
复制链接

扫一扫