css伪元素::before ::after中content属性搭配attr使用

最新推荐文章于 2025-05-13 15:23:59 发布

汉三姓胡

最新推荐文章于 2025-05-13 15:23:59 发布

阅读量3k

点赞数

CC 4.0 BY-SA版权

分类专栏： html+css 文章标签： css 伪元素

本文链接：https://blog.youkuaiyun.com/hnnd123/article/details/94559071

html+css 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种利用CSS伪元素::after和attr()函数显示HTML元素属性值的方法，通过实例展示了如何将div元素的content属性值作为标题显示。

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div>
	//声明一个属性content
    <div class="title" content="这是标题">

    </div>

    <p>
        这是内容
    </p>

</div>

<style>
    .title::after {
        content: attr(content);
    }
</style>

</body>
</html>

效果：
在这里插入图片描述
参考：https://www.cnblogs.com/pageye/p/4733127.html