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

原创于 2019-07-03 14:04:03 发布 · 3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #伪元素

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