微信小程序的多选改变样式_微信小程序更改radio/checkbox 单选/多选默认样式
时间: 2023-07-13 15:41:00 浏览: 509
微信小程序自定义单项选择器样式
要更改微信小程序中的radio/checkbox单选/多选默认样式,需要在wxss文件中进行样式覆盖。以下是一个示例:
```css
/* 更改checkbox未选中时的样式 */
.checkbox-container .weui-icon-unchecked {
width: 20px;
height: 20px;
border: 1px solid #999;
border-radius: 2px;
}
/* 更改checkbox选中时的样式 */
.checkbox-container .weui-icon-checked::before {
content: "\EA10";
font-family: weui-icon;
color: #1AAD19;
font-size: 20px;
}
/* 更改radio未选中时的样式 */
.radio-container .weui-icon-unchecked {
width: 20px;
height: 20px;
border: 1px solid #999;
border-radius: 50%;
}
/* 更改radio选中时的样式 */
.radio-container .weui-icon-checked::before {
content: "\EA10";
font-family: weui-icon;
color: #1AAD19;
font-size: 20px;
}
```
在上面的示例中,我们使用了weui-icon字体库中的图标来替换默认的checkbox/radio选中状态的样式。同时,我们还更改了未选中状态的样式,使其更符合我们自己的需求。
这只是一个示例,你可以根据自己的需求进行更改。
阅读全文