收藏
评论

小程序更改checkbox和radio默认样式

1、checkbox


checkbox .wx-checkbox-input{

    border-radius:50%;

    width:20px;height:20px;

}
checkbox .wx-checkbox-input.wx-checkbox-input-checked{

    border-color:#F0302F !important;

    background:#F0302F !important;

}
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{

    border-radius:50%;

    width:20px;

    height:20px;

    line-height:20px;

    text-align:center;

    font-size:15px;

    color:#fff;

    background:transparent;

    transform:translate(-50%, -50%) scale(1);

    -webkit-transform:translate(-50%, -50%) scale(1);

}



2、radio


radio .wx-radio-input{

    border-radius:50%;

    width:20px;height:20px;

}
radio .wx-radio-input.wx-radio-input-checked{

    border-color:#F0302F !important;

    background:#F0302F !important;

}
radio .wx-radio-input.wx-radio-input-checked::before{

    border-radius:50%;

    width:20px;

    height:20px;

    line-height:20px;

    text-align:center;

    font-size:15px;

    color:#fff;

    background:transparent;

    transform:translate(-50%, -50%) scale(1);

    -webkit-transform:translate(-50%, -50%) scale(1);

}



如果上面的代码对您有帮助,麻烦抖一抖小手点下赞,谢谢


收藏

12 个评论

  • Joshua
    Joshua
    2019-12-14

    没生效

    2019-12-14
    赞同 2
    回复
  • 刘😦1
    刘😦1
    05-01

    宽高没生效

    05-01
    赞同 1
    回复
  • Oray
    Oray
    2019-03-18

    我想说句,伪类那儿是改不了的。就是对勾那类名是失效


    2019-03-18
    赞同 1
    回复
  • 鲍丙郑
    鲍丙郑
    2018-07-19

    .wx-checkbox-input 这是从哪找出来的?控制台我找好久没发现

    2018-07-19
    赞同 1
    回复 2
    • 疏影柏翠胭脂淡
      疏影柏翠胭脂淡
      2018-09-14

      +1  同想问楼主 怎么找到的

      2018-09-14
      回复
    • xiaoming
      xiaoming
      2019-05-20

      同问,这些样式是怎么找到的?小程序没有公布组件的源码,大佬是怎么找到的?

      2019-05-20
      回复
  • ゛
    2019-07-03

    自定义组件直接加不行啊,要怎么做才可以添加上

    2019-07-03
    赞同
    回复
  • Duō_rui mi
    Duō_rui mi
    2019-06-26

    棒棒哒

    2019-06-26
    赞同
    回复
  • 霞宝不想起床
    霞宝不想起床
    2019-06-25

    不论你怎么找到的,此时此刻的我只想夸你,你真棒

    2019-06-25
    赞同
    回复
  • 徐来
    徐来
    2019-05-14

    成功使用,多谢

    2019-05-14
    赞同
    回复
  • giroflee
    giroflee
    2019-03-08

    很棒,成功修改颜色!

    2019-03-08
    赞同
    回复
  • 钟
    2018-11-23

    赞👍

    2018-11-23
    赞同
    回复

正在加载...

登录 后发表内容