免费获取csdn超级会员，了解一下？（你还不知道）

一个处女座的测试

于 2021-01-14 22:22:12 发布

阅读量1.7w

点赞数 5

CC 4.0 BY-SA版权

分类专栏：工作技能文章标签： css

本文链接：https://blog.csdn.net/ZangKang1/article/details/112643035

工作技能专栏收录该内容

2 篇文章

订阅专栏

本文分享了一种在网页上通过修改DOM，使用CSS绝对定位创建VIP身份标识的方法。通过添加自定义div并设置样式，实现了在头像旁显示‘SVIP’标签的装X效果。步骤包括在控制台找到头像容器，插入新div，并调整位置和层级，最终实现个性化展示。

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

中午,同事给我截了张图

呦呵，居然给我显示VIP贵族的身份，我这小暴脾气(σ｀д′)σ

立马甩过去一张，超级VIP的图

当然，这可不是用PS画的

这是砸搞出来的？

首先，在控制台里，找到自己的头像

然后，找到img所在的父级容器 <dt> 右击

在这里，添加我们的dom div

这里贴一下源码

<div style="BACKGROUND: gold;color: white;width: 32px;height: 18px;text-align: center;position: absolute;top: 152px;z-index: 50000;font-weight: bolder;left: 77px;">SVIP</div>

这里，通过 absolute 绝对定位的方式结合 top和left,控制好“装X”标签和头像的距离

若是看不到，记得添加 z-index，值越大越好

然后，就装逼成功了，甚至可以把他叫到自己的电脑前