私はtooltip
を持っており、h1
とh4
にあります。ここでは、h4
上で次のようになります。h1ツールチップがh4よりもはるかに高いです
そして、ここではh1
は、次のようになります。
tooltip
はh4
よりh1
最大はるかに高いです。基本的に、私は両者がまったく同じに見えるようにしたい。事前に
.tooltip {
position: relative;
display: inline-block;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 150px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 150%;
left: 50%;
margin-left: -60px;
font-size: 16px;
}
.tooltip:hover {
cusor: pointer;
}
.tooltip .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: black transparent transparent transparent;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
<p></p>
<p></p>
<p></p>
<p></p>
<center>
<!-- h4 tooltip -->
<div class = "tooltip"><span id = "htmlHub" class = "contact">programs</span><span class="tooltiptext">Go to the Programs tab</span></div>
<!-- h1 tooltip -->
<div id = "rockPaperScissors" class = "programs tooltip"><h1>Rock Paper Scissors</h1><span class="tooltiptext">Go to the Rock Paper Scissors program</span></div>
</center>
ありがとう:
は、ここに私のコードです!