uni-app radio的样式如何修改

前端中的input类标签中的radio和checkbox前面的选框的禅碧样式是不能改变的，笑昌但是这往往会造成我们在用起来时候样式的局限性，以下是改变样贺升举式的方法：隐藏默认样式，并将自己喜欢的样式作为背景图片显示；

首先：将默认样式隐藏，代码为

input[type = "radio"] {

display: none

}

方法/步骤

打开微信小程序开发工具，打开已新建的或新建一个项目

请点击输入图片描述

新建一个页面文件wxml，插入一个radio-group，然后内嵌四个radio

请点击输入图片描述

保存代码并查看左侧模拟器，可以查看到一组单选按钮

请点击输入图片描述

在对应页面的JS文件中，定义单选按钮组change事件changeJa

请点击输入图片描隐判述

保存代码并打开内置浏览器控制台，点击单选按钮，查看打印结果

请点击输入图片描述

下载WeUI文件，然后将相关的样式文件拷贝进去，然后修改界面并调用样式类

请点击输入图片描述

再次保存代码拆携明并查看左侧模旅告拟器，可以看到单选按钮样式变成了按钮的样式

请点击输入图片描述

1、首先我们新建一行旁埋个小程序，目录如下图所示。

2、接着我们给页面声明个背景色，方便查看效果。

3、然后在页面中定义一个button，如下图所示。

4、可以看到档蚂左侧的button效果如下图所示。

5、然后我们直接在button中重启拍新填写要修改的默认样式即可覆盖，如下图所示。

6、可以看到页面的button样式被修改掉了。

---