Difference between revisions of "Template:Tt"
From Detective Conan Wiki
| Line 1: | Line 1: | ||
| − | < | + | <div class="tooltip">{{{1}}}<span class="tooltiptext">{{{2}}}</span></div> |
| + | {{css| | ||
| + | .tooltip { | ||
| + | position: relative; | ||
| + | display: inline-block; | ||
| + | border-bottom: 1px dotted black; | ||
| + | } | ||
| + | |||
| + | .tooltip .tooltiptext { | ||
| + | visibility: hidden; | ||
| + | opacity: 0; | ||
| + | transition: opacity 0.2s; | ||
| + | max-width: 140px; | ||
| + | width: fit-content; | ||
| + | background-color: white; | ||
| + | color: black; | ||
| + | text-align: center; | ||
| + | border-radius: 3px; | ||
| + | padding: 6px 8px; | ||
| + | box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2); | ||
| + | border: 1px solid #ccc; | ||
| + | |||
| + | position: absolute; | ||
| + | z-index: 1; | ||
| + | bottom: 100%; | ||
| + | left: 50%; | ||
| + | transform: translateX(-50%); /* center the whole tooltip */ | ||
| + | } | ||
| + | |||
| + | .tooltip:hover .tooltiptext, | ||
| + | .tooltip .tooltiptext:hover { | ||
| + | visibility: visible; | ||
| + | opacity: 1; | ||
| + | } | ||
| + | }} | ||
[[Category:Templates]]</noinclude> | [[Category:Templates]]</noinclude> | ||
Revision as of 16:55, 1 June 2025
{{{1}}}{{{2}}}
