在微信小程序里面,有時(shí)候?yàn)榱伺浜险麄€(gè)項(xiàng)目的風(fēng)格,checkbox和radio的樣式會(huì)有些不同祝懂。
- 修改checkbox樣式
.wxml
<checkbox-group class='pull-left' bindchange="checkboxChange">
<label class="checkbox flex flex-vc ">
<checkbox bindchange='checkboxChange' value="" checked="{{checkboxStatus}}" color='#fff'/>
<view>可用2000個(gè)積分幣抵扣</view>
</label>
</checkbox-group>
.wxss
/* checkbox未選中時(shí)樣式 */
checkbox .wx-checkbox-input{
border-radius: 3rpx;
height: 26rpx;
width: 26rpx;
margin-top: -4rpx;
/* 自定義樣式.... */
}
/* checkbox選中時(shí)樣式 */
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
background-color: #e02e24;
border: 1rpx solid #e02e24;
/* 自定義樣式.... */
}
- 修改radio樣式
.wxml
<radio-group class="radio-group" bindchange="radioChange">
<label class="radio" wx:for="{{items}}">
<radio value="{{item.name}}" checked="{{item.checked}}" color="#fff"/>{{item.value}}
</label></radio-group>
.wxss
/* radio未選中時(shí)樣式 */
radio .wx-radio-input{
border-radius: 3rpx;
height: 26rpx;
width: 26rpx;
margin-top: -4rpx;
/* 自定義樣式.... */
}
/* radio選中時(shí)樣式 */
radio .wx-radio-input.wx-radio-input-checked::before{
background-color: #e02e24;
border: 1rpx solid #e02e24;
/* 自定義樣式.... */
}
作者:Lucky_Aimee
來源:CSDN
原文:https://blog.csdn.net/qq_39364032/article/details/79742415?utm_source=copy
版權(quán)聲明:本文為博主原創(chuàng)文章咕娄,轉(zhuǎn)載請(qǐng)附上博文鏈接!