微信小程序：修改单选radio大小样式_微信小程序修改radio的大小

通过scale将其缩小

<radio style="transform:scale(0.8)" checked="true" value="true"></radio>
1

修改样式

/* 未选中的样式 */
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);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

参考
微信小程序修改默认radio大小样式
小程序更改checkbox和radio默认样式