CSS3学习笔记（十一）——UI元素状态伪类选择器 a标签的伪类选择器

最新推荐文章于 2024-04-28 15:57:19 发布

Bambi12

最新推荐文章于 2024-04-28 15:57:19 发布

阅读量365

点赞数 1

CC 4.0 BY-SA版权

分类专栏： CSS

本文链接：https://blog.youkuaiyun.com/Bambi12/article/details/84790207

CSS 专栏收录该内容

24 篇文章

订阅专栏

本文深入讲解了CSS中四种常用的伪类选择器：:link、:visited、:hover和:active，详细介绍了它们在链接不同状态下的应用，如链接未访问、已访问、鼠标悬停和鼠标点击时的样式变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

:link 链接被访问之前样式

:visited 链接被访问之后样式

:hover 链接在鼠标悬停时样式

:active 链接在鼠标被按下后样式

注：尽量按以上顺序书写

<!DOCTYPE html>
<html>
<head>
    <title>apseudo</title>
    <style>
        a{
            width: 100%;
            float: left;
            margin-left: 10px;
        }
        a:link{
            color:black;
        }
        a:visited{
            color:red;
        }
        a:hover{
            color:yellow;
        }
        a:active{
            color: green;
        }
    </style>
</head>
<body>
    <a>被访问之前为黑色</a>
    <a>被访问之后为红色</a>
    <a>鼠标悬停为黄色</a>
    <a>鼠标点击为绿色</a>
</body>
</html>

Love/Hate原则，我也是从别人那里知道的，感觉记起来还不错，赞！

笔记整理出自：https://www.imooc.com/learn/33