微信小程序按钮点击时的样式hover-class=“hover“

本文主要是介绍微信小程序按钮点击时的样式hover-class=“hover“，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

小程序的button组件很好用，按钮点击的时候会显示点击状态，默认的就是颜色加深

但是我们改变了button的背景色之后，就看不出点击效果了，解决起来也很简单

关键代码就是小程序的 hover-class 属性，需要注意的是，hover-class 的属性中的样式必须加 !important 不然没有不显示效果

产生该问题的原因为：在css中，内联样式 style的优先级要高于class选择器的优先级，所以在我们添加style标签后即使添加hover-class选择器也会被内联样式style所覆盖，导致hover-class选择器失效，无法实现点击按钮后的效果。

 <button hover-class="hover">我要投票</button>

.voteText .hover{background-color: #bb241c !important;color: #f2f2f2 !important;
}

改完可以看到按钮点击的时候颜色变成了我们设置的颜色

这篇关于微信小程序按钮点击时的样式hover-class=“hover“的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---