嘿!教你做个“黑幕说悄悄话”的效果
有时候吧,总有些话不想让人第一眼就看到,但又想留给好奇宝宝们去发现
比如下面这样:
(啊对对对,文章中无端端出现黑色的东西,是个猫?也会摸上去)
emmm就像上面一样,鼠标移上去它就现身了!是不是很神奇?
咱这就来唠唠怎么搞~
1. CSS 部分
把下面的代码扔到:后台 → 外观 → 自定义 → 额外CSS 里就行。其他博客系统如果有“附加CSS”功能也一样操作~
.heimu, .heimu a, a .heimu, .heimu a.new {
background-color: #252525;
color: #252525;
text-shadow: none;
}
.heimu:hover, .heimu:active,
.heimu:hover .heimu, .heimu:active .heimu {
color: white !important;
}
.heimu:hover a, a:hover .heimu,
.heimu:active a, a:active .heimu {
color: lightblue !important;
}
.heimu:hover .new, .heimu .new:hover, .new:hover .heimu,
.heimu:active .new, .heimu .new:active, .new:active .heimu {
color: #BA0000 !important;
}
如果你是其他博客模板,就按人家的方式加~
要是完全自己撸的网站……那你就放你该放 CSS 的地方呗
(md,完全自己设计的网站,不知道什么是CSS放在哪里?我不信)
(还有你,连HTML和CSS都不会,你还做什么网站)
2. HTML 部分
下面轮到 HTML 小零件登场~
<span class="heimu" title="你知道的太多了">这是隐藏的文字</span>- title:就是你鼠标悬停时蹦出来的小提示
- “这是隐藏的文字”:换成你自己想说但不想让人一眼看到的大实话
(不要告诉我你还是不会)
(什么,你问我能不能搞其他颜色,不要黑色?但凡知道CSS是什么东西的人都会改,别告诉我你真的不知道)
(你是CSS大佬,要入侵我的网站????来来来来,用你的CSS编写一个软件来入侵我的网站)
参考文献(虽然我觉得上面已经够清楚了):
如何实现黑幕?即鼠标触及之地,原来黑色显示原来文字 - 腾讯云开发者社区
快去试试叭!让你的文章也多点神秘小彩蛋~
©版权声明
文章版权归作者所有,未经允许请勿转载。
THE END

-
最新
-
最热
只看作者