1、5伪类选择器

最新推荐文章于 2024-07-06 16:25:37 发布

这一片月

最新推荐文章于 2024-07-06 16:25:37 发布

阅读量88

点赞数

分类专栏： css样式文章标签： css

本文链接：https://blog.csdn.net/qq_62865634/article/details/126454028

版权

css样式专栏收录该内容

41 篇文章 1 订阅

订阅专栏

提示：伪类选择器是添加特殊效果，比如链接，伪类选择器书写大特点有冒号“：”表示。

1、语法：

hover：hoxer{

color：pink；

}

伪类：链接、结构、表单............................等等。

a:link 选择为被访问

a:visited 选择已被访问

a:hover 选择标指其上链接

a:active 选择活动链接，注意：按下还没有弹起

自己代码展示：

<!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>伪类选择器</title>
    <style>
        /* 未访问的链接选择用 a:link 、将为访问的链接选择出来*/
        
        a:link {
            color: black;
            text-decoration: none;
        }
        
        a:visited {
            /* 这里a：visited表示这个链接已经访问过或点击过的 */
            color: tomato;
        }
        
        a:hover {
            /* 这里a:hover表示鼠标经过颜色 */
            color: yellowgreen;
        }
        
        a:active {
            /* 这里a:sctive表示我们鼠标正在按下还有没有弹起 */
            color: deepskyblue;
        }
    </style>
</head>

<body>
    <a href="#">小猪佩奇</a>
</body>

</html>

显示结果：