使文本显示在悬停按钮

问题描述：

<button class="addMore">+</button>

做这样的效果：

https://i.gyazo.com/d353b657df39c0e6ff159bfdb713f6a4.mp4

，当你在它悬停。

我已经能够找到几个不同的东西，但没有一个是我想要的在视频中的行为。

答

使用title，以显示您的留言：

<button class="addMore" title="click here">+</button>

哇，这么简单。在这里，我在乱搞：徘徊了一小时尝试不同的事情......我感到羞愧，但嘿，这就是你学习的方式。我再也不会犯这个错误了。 – DragonHeart000

后续问题，是否可以设置？ – DragonHeart000

答

您可以使用CSS设置如下按钮的背景颜色变化，

.addMore:hover { 
    background-color: #545454; //desired color code 
}

，并设置工具提示为<button class="addMore" title="click here">+</button>

答

.addMore{ 
 
    border: none; 
 
    width: 32px; 
 
    height: 32px; 
 
    background-color: #eee; 
 
    transition: all ease-in-out 0.2s; 
 
    cursor: pointer; 
 
} 
 
.addMore:hover{ 
 
    border: 1px solid #888; 
 
    background-color: #ddd; 
 
}

<button class="addMore" title="Hover on me!">+</button>

使文本显示在悬停按钮

相关推荐