banner
endercat

endercat

某个白嫖怪的分享博客 现已迁移到 https://endercat.eu.org 请前往该URL查看最新文章
bilibili
github
telegram

在博客上使用黑条字

本文所有代码均来自萌娘百科

介绍#

黑条字指默认情况下是一个黑条,把鼠标悬停在黑条字上显示被遮挡的文字。

示例#

文字

使用方法#

将以下代码放到页面的 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;
}

实现黑幕效果,只需简单添加以下代码:在目标文字前加<span class="heimu" title="此处为悬浮在黑条上显示的字">,并在目标文字后加上</span>即可。这样,目标文字将会被覆盖在一个黑色半透明背景下,达到黑幕的效果。

加载中...
此文章数据所有权由区块链加密技术和智能合约保障仅归创作者所有。