CSS3案例之target伪类

最新推荐文章于 2024-08-18 23:12:09 发布

宅羽

最新推荐文章于 2024-08-18 23:12:09 发布

阅读量360

点赞数

分类专栏： CSS3案例

本文链接：https://blog.csdn.net/sky6even/article/details/88379398

版权

本文详细探讨了CSS3中的target伪类，讲解了如何利用它来改变已点击链接对应的元素样式。通过实例解析，展示了target伪类在页面交互设计中的强大功能，帮助开发者提升用户体验。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        .nav{
            position: fixed;
            left:0;
            top:100px;

        }

        .content{
            width: 800px;
            margin: 0 auto;
        }
        /* :target 伪类 要配合锚点使用 */
        /* 表示被激活的状态*/
        h2:target{
            color: red;
            font-family: "Microsoft Yahei";
        }
    </style>
</head>
<body>
<ul class="nav">
    <li><a href="#title1">CSS (层叠样式表)</a></li>
    <li><a href="#title2">实例</a></li>
    <li><a href="#title3">发展历史</a></li>
    <li><a href="#title4">发展历史</a></li>
    <li><a href="#title5">布局特点</a></li>
    <li><