伪类与伪标签

CSS伪类与伪元素实战

最新推荐文章于 2022-10-21 11:01:27 发布

weixin_30701521

最新推荐文章于 2022-10-21 11:01:27 发布

阅读量98

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/liverpool-ADH/p/9787710.html

本文通过实例演示了如何使用CSS伪类和伪元素来增强网页的表现力，包括:hover和:visited伪类以及:first-line和:first-letter伪元素的具体应用。

这是一个测试伪类的链接

这是一句测试伪元素的文本

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style type="text/css">
        a:hover {
            color: red;
        }
        a:visited {
            color: green;
        }
        p:first-line {
            color: red;
        }
        p:first-letter {
            color: blue;
            font-size: xx-large;
        }
    </style>

</head>
<body>
    <div class="one">
    <a href="http://www.cnblogs.com" >这是一个测试伪类的链接</a>
    </div>
    <div class="two">
        <p>这是一句测试伪元素的文本</p>
    </div>

</body>
</html>