当前位置: 首页 > news >正文

uni-app 修改复选框checkbox选中后背景和字体颜色

编写css(注意:这个样式必须写在App.vue里)

/* 复选框 */
/* 复选框-圆角 */
checkbox.checkbox-round .wx-checkbox-input,
checkbox.checkbox-round .uni-checkbox-input {border-radius: 100rpx;
}
/* 复选框-背景颜色 */
checkbox.checkbox-backgroun-yellow[checked] .wx-checkbox-input,
checkbox.checkbox-backgroun-yellow.checked .uni-checkbox-input{background-color: #FFC457 !important;border-color: #FFC457 !important;color: #ffffff !important;
}

使用,在checkbox中的class中使用在round和checkbox-backgroun-yellow

<checkbox-group @change="signTypeChange"><label class="mr-10"><checkbox v-if="isShowSignIn" class="checkbox-backgroun-yellow" checked="true" value="1" >签到</checkbox></label><label><checkbox v-if="isShowSignOut" class="checkbox-backgroun-yellow" checked="true" value="2" >签退</checkbox></label>
</checkbox-group>

效果

http://www.lryc.cn/news/489586.html

相关文章:

  • 使用Notepad++工具去除重复行
  • 基于Springboot+Vue的救灾物资调动系统 (含源码数据库)
  • Unity 使用 Excel 进行配置管理(读Excel配置表、Excel转保存Txt 文本、读取保存的 Txt 文本配置内容)
  • MySQL中索引全详解
  • vllm serve的参数大全及其解释
  • 2025职业院校技能大赛信息安全管理与评估(河北省) 任务书
  • 通过高德 JS API 实现H5端定位
  • 第J6周:RenseNeXt-50实战
  • JAVA八股与代码实践----接口与抽象类的区别和用法
  • 详解 【AVL树】
  • SQLite Having 子句
  • ZYNQ-7020嵌入式系统学习笔记(1)——使用ARM核配置UART发送Helloworld
  • 实践篇:青果IP助理跨境电商的高效采集
  • 本地安装YAPI
  • pytest日志总结
  • day16
  • 医工交叉入门书籍分享:Transformer模型在机器学习领域的应用|个人观点·24-11-22
  • 【读书】复杂性意义结构框架——Cynefin框架
  • Python模块、迭代器与正则表达式day10
  • Hutool工具类生成二维码
  • wpf 事件转命令的方式
  • 第二十八章 TCP 客户端 服务器通信 - JOB命令示例
  • 「Mac玩转仓颉内测版19」PTA刷题篇10 - L1-010 比较大小
  • C++趣味编程玩转物联网:用树莓派Pico实现一位数码管动态显示
  • SPA 单页面深入解读:优劣势剖析及实现方法
  • 机器学习系列----关联分析
  • json数据四大加载方式
  • JavaScript 中的数组(Array)对象的内置方法
  • 网络安全之国际主流网络安全架构模型
  • 电子应用设计方案-16:智能闹钟系统方案设计