微信小程序中盔然，選項(xiàng)的默認(rèn)樣式是一個(gè)對(duì)勾，非常丑焕参，雖然可以更改選中時(shí)圖片的路徑轻纪，但是不用圖片， 用樣式也是非常好看的叠纷，效果如下：
image.png
沒啥可說(shuō)的刻帚， 直接上代碼，復(fù)制粘貼涩嚣，放到 app.wxss中既可崇众。 非常簡(jiǎn)單。
更改小程序中 單選框航厚、多選框的默認(rèn)樣式：
/*更改全局 radio樣式*/
radio .wx-radio-input {
border-radius: 50%;
width: 28rpx;
height: 28rpx;
border: 2rpx solid #9fa7a9;
}
/* 選中后的 樣式 */
radio .wx-radio-input.wx-radio-input-checked {
border-color: #2792ff !important;
}
/* 選中后的 對(duì)勾樣式 */
radio .wx-radio-input.wx-radio-input-checked::before {
/* 去除對(duì)號(hào) */
content: '';
font-size: 0rpx;
border-radius: 50%;
width: 70%;
height: 70%;
text-align: center;
background-color: #2792ff;
transform: translate(-50%, -50%) scale(1);
-webkit-transform: translate(-50%, -50%) scale(1);
}
/*checkbox未選中時(shí)樣式 */
checkbox .wx-checkbox-input {
/* border-radius: 50%; */
width: 28rpx;
height: 28rpx;
border: 2rpx solid #9fa7a9;
}
/* 選中后的 樣式 */
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
/* border-radius: 50%; */
border-color: #2792ff !important;
}
/* 選中后的 對(duì)勾樣式 */
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
/* border-radius: 50%; */
/* 去除對(duì)號(hào) */
content: '';
font-size: 0rpx;
text-align: center;
width: 70%;
height: 70%;
background-color: #2792ff;
transform: translate(-50%, -50%) scale(1);
-webkit-transform: translate(-50%, -50%) scale(1);
}
