小程序的按钮按下去的样式（button-hover）为啥不起作用？

作者：繁依Fanyi0 | 2024-03-24 13:06:20

踩

button-hover

微信小程序的button中，可以指定按下去的类名，例如：

<button hover-class="button-hover">同意</button>
1

默认的类名就是 button-hover，因此上面的类名定义可以省略。

根据官方开发文档，在wxss中定义类名样式，就可以自定义按钮按下去的样式。但是我在开发中，发现直接这样写没有效果：

.button-hover {
  background-color: grey;
}
1
2
3

检查下来发现原因是，button已经自定义了背景色，样式选择权重有影响，button的样式如下：

.wrap button {
  background-color: green;
}
1
2
3

因此把hover选择器修改一下就可以了：

.wrap button.button-hover {
  background-color: grey;
}
1
2
3

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：【wpsshop博客】