All code in this article is from Moegirlpedia
Introduction#
Black bar text refers to a default black bar that displays hidden text when the mouse hovers over it.
Example#
Text
Usage#
Place the following code in the CSS of the page:
.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;
}
To achieve the black bar effect, simply add the following code: place <span class="heimu" title="Text displayed when hovering over the black bar">
before the target text, and add </span>
after the target text. This way, the target text will be covered by a black semi-transparent background, creating the black bar effect.