gpt4 book ai didi

html - 将占位符添加到悬停

转载 作者:行者123 更新时间:2023-11-28 05:13:55 25 4
gpt4 key购买 nike

如何为 Firefox 的悬停功能添加占位符。

.hover  {
width: 49px;
height: 20px;
margin-top: 200px;
position: absolute;
top: -200px;
left: 48%;
right: 50%;
opacity: .9;
z-index: 3;
}
<div class="hover"> <img src="http://static.tumblr.com/e2rgcy1/ma6od7pby/dropdown-button.png" /></div>

最佳答案

<style>
.tooltip {
position: relative;
display: inline-block;
}

.tooltip .tooltiptext {
visibility: hidden;
width:100px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;

/* Position the tooltip */
position: absolute;
z-index: 1;
}

.tooltip:hover .tooltiptext {
visibility: visible;
}
<!DOCTYPE html>
<html>

<body style="text-align:center;">



<div class="tooltip"><img src="http://static.tumblr.com/e2rgcy1/ma6od7pby/dropdown-button.png" />
<span class="tooltiptext">Facebook</span>
</div>


</body>
</html>

关于html - 将占位符添加到悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39410613/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com