关于 uniapp view标签使用 hover-class属性不生效问题解决

在uni-app中尝试使用hover-class实现点击高亮,但遇到样式不生效的问题。解决方法是在CSS中为hover-class添加更高的权重,例如使用!important。确保hover-class样式覆盖原有样式,同时可以借助背景色调试来检查样式是否正确引入并调整优先级。

问题
使用hover-class实现点击高亮效果!但是无论怎么修改样式都不生效!
解决:
相同的样式中如果只有部分变动,如字体大小,主要设置权重,将hover-class的级别添加!important,就能看到效果;

标签自身的样式:

.item{
			text-align: center;
			line-height: 30rpx;
			font-size: 24rpx;
			color: #fff;
		}

点击hover-class后的样式
(此处设置的是hover-class=“hover”,所以下面的样式名是.hover)

.hover{
	text-align: center;
	line-height: 30rpx;
	font-size:36rpx !important;
	color: #fff;
}

也可以先使用背景色进行调试,看样式是否引入,再根据样式显示的优先级进行修改!

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值