uni-app中更改复选框的默认样式

薛定喵君 发表于 2021/09/28 22:14:23 2021/09/28
【摘要】 uni-app复选框默认样式修改问题/* #ifdef H5 */uni-checkbox .uni-checkbox-input { border-radius: 50% !important; color: #ffffff !important;}uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked { border...

uni-app复选框默认样式修改问题


/* #ifdef H5 */
uni-checkbox .uni-checkbox-input {
  border-radius: 50% !important;
  color: #ffffff !important;
}

uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked {
  border: none !important;
  background: #3d7eff;
	border-color: #3d7eff;
}

uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked::before {
	width: 20rpx;
	height: 20rpx;
	line-height: 20rpx;
	text-align: center;
	font-size: 18rpx;
	color: #fff;
	background: transparent;
	transform: translate(-70%, -50%) scale(1);
	-webkit-transform: translate(-70%, -50%) scale(1);
}

/* #endif */
/* 微信样式 */
/* #ifdef APP-PLUS ||MP-WEIXIN */
checkbox .wx-checkbox-input {
  border-radius: 50% !important;
  color: #ffffff !important;
}

checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  color: #fff;
  background: #3d7eff;
}

.wx-checkbox-input.wx-checkbox-input-checked {
  border: none !important;
}

/* #endif */
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区),文章链接,文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件至:cloudbbs@huaweicloud.com进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容。
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。