Question

如何为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>

Answer 1

<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>

添加占位符以悬停

1 个答案: