微信小程序 switch 样式

Posted 2021-02-21 认真生活、快乐工作 - 马云

/*swtich整体大小及背景色*/
.wx-switch-input{
  width:80rpx !important;
  height:35rpx !important;
  background: #ccc !important;
  border: #ccc !important;
}
/*白色样式（false的样式）*/
.wx-switch-input::before{
  width:80rpx !important;
  height: 35rpx !important;
}
/* 中间的小圆球 */
/*绿色样式（true的样式）*/
.wx-switch-input::after{
  width: 40rpx !important;
  height: 35rpx !important;
}

更改前

更改后