微信小程序 修改默认单选,多选按钮样式

微信小程序 修改默认单选,多选按钮样式

1.在微信开发者文档中复制一份单选或者多选的代码
<!--pages/index3/index.wxml-->
<radio-group bindchange="radioChange"><label class="weui-cell weui-check__label" style="display: flex;"><radio value="1" checked="true"/><view class="weui-cell__bd">按钮1</view></label><label class="weui-cell weui-check__label" style="display: flex;"><radio value="1" checked="true"/><view class="weui-cell__bd">按钮1</view></label><label class="weui-cell weui-check__label" style="display: flex;"><radio value="1" checked="true"/><view class="weui-cell__bd">按钮1</view></label></radio-group>
2. 根据情况复制单选或者多选代码即可

index.wxss

/* pages/index3/index.wxss */
/* 单选按钮样式 */
.wx-radio-input {width: 32rpx !important;height: 32rpx !important;border-radius: 100%;background-color: #fff !important;}/*勾选样式 */.wx-radio-input.wx-radio-input-checked {border: none !important;background-color: #6784f5 !important;}/* 多选框样式 *//* 未勾选样式 */
.wx-checkbox-input {width: 33rpx !important;height: 33rpx !important;
}
/* 勾选样式 */
.wx-checkbox-input.wx-checkbox-input-checked{border-color:#6784f5 !important;background:#6784f5 !important;
}

这样就ok了。
注:仅记录方便开发查找。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/166569.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

小程序:project.config.json / project.private.config.json / 项目配置文件 /拉取代码产生冲突 / 如何解决

一、理解project.config.json / project.private.config.json project.config.json 文件是项目的配置文件&#xff0c;它包含了关于小程序的一些基本信息&#xff0c;例如小程序的名称、App ID、开发者信息以及页面路径等。这个文件一般不会被提交到版本控制系统中&#xff0c;…

cartographer_ros使用

首先根据官方指导安装cartographer。然后创建ros工作空间并拉取 cartographer_ros 代码 mkdir -p carto_ws/src cd carto_ws/src catkin_init_workspace git clone https://github.com/cartographer-project/cartographer_ros.git现在需要安装cartographer_ros依赖项。首先&a…

微信小程序使用腾讯地图实现地点搜索并且随着地图的滑动加载滑动到区域的地点,本文地点使用医院关键词作为搜索地点

实现效果如下 1.页面加载时&#xff0c;根据getLocation方法获取用户当前经纬度获取20条医院位置信息 2.页面滑动时&#xff0c;根据滑动到的经纬度再次获取20条医院位置信息 获取到的医院位置信息 实现方法如下 1.在.wxml中添加触发滑动的方法bindregiοnchange“onMapRegio…

【Spring集成MyBatis】核心配置文件

文章目录 1. typeHandlers标签2. plugins标签通过PageHelper的API获取分页的信息 1. typeHandlers标签 可以重写类型处理器&#xff0c;或创建类型处理器来处理不支持/非标准的类型。选择性地将它映射到一个JDBC类型&#xff1a;如Java中的Date类型&#xff0c;将其存放到数据…

docker安装以及idea访问docker

其他目录&#xff1a; docker 安装环境&#xff08;有空更新&#xff09; url “” docker 打包java包&#xff0c;并运行&#xff08;有空更新&#xff09; url “” docker 打包vue &#xff08;有空更新&#xff09; url “” docker 多服务 &#xff08;有空更新&#xff…

2023年亚太杯数学建模A题水果采摘机器人的图像识别功能(matlab 部分代码)

对于1-4问针对的是附录1 中的数据 clc; close all; clear; % 图像文件夹路径 folder_path E:/新建文件夹/yatai/Attachment/Attachment 1/; % 图像文件列表 image_files dir(fullfile(folder_path, *.jpg)); % 假设所有图片都是jpg格式% 解析文件名中的数字&#xff0c;并转…

机器学习探索计划——数据集划分

文章目录 导包手写数据划分函数使用sklearn内置的划分数据函数stratifyy理解举例 导包 import numpy as np from matplotlib import pyplot as plt from sklearn.datasets import make_blobs手写数据划分函数 x, y make_blobs(n_samples 300,n_features 2,centers 3,clus…

Java设计模式系列:单例设计模式

Java设计模式系列&#xff1a;单例设计模式 介绍 所谓类的单例设计模式&#xff0c;就是采取一定的方法保证在整个的软件系统中&#xff0c;对某个类只能存在一个对象实例&#xff0c;并且该类只提供一个取得其对象实例的方法&#xff08;静态方法&#xff09; 比如 Hiberna…

循环队列的几种实现方式

基于数组来实现循环队列的几种方式 使用 usedSize使用 标志位空出一个位置 方式一 usedSize 0 是则表示当前数组为空 usedSize 数组的长度 则表示当前数组满了方式二 使用一个标记 flag 来判断当前队列是空还是满 如果 flag false 则说明队列为空 如果 flag true 则说…

leetcode:495. 提莫攻击

一、题目 链接&#xff1a;495. 提莫攻击 - 力扣&#xff08;LeetCode&#xff09; 函数原型&#xff1a;int findPoisonedDuration(int* timeSeries, int timeSeriesSize, int duration) 二、思路 遍历数组timeSeries&#xff0c;如果 元素值duration < 下一元素值 &#x…

GO语言实现txt文本多行合并为一行

windows系统txt文件 input.txt多行合并为一行 package mainimport ("fmt""io/ioutil""strings" )func main() {content, err : ioutil.ReadFile("E:\\gin_demo\\demo30DNF\\youhua\\input.txt")if err ! nil {fmt.Println("Err…

OpenCV快速入门:图像分析——傅里叶变换、积分图像

文章目录 前言一、傅里叶变换1.1 离散傅里叶变换1.1.1 离散傅里叶变换原理1.1.2 离散傅里叶变换公式1.1.3 代码实现1.1.4 cv2.dft 函数解析 1.2 傅里叶变换进行卷积1.2.1 傅里叶变换卷积原理1.2.2 傅里叶变换卷积公式1.2.3 代码实现1.2.4 cv2.mulSpectrums 函数解析 1.3 离散余…

基于深度学习的文本分类

通过构建更复杂的深度学习模型可以提高分类的准确性&#xff0c;即分别基于TextCNN、TextRNN和TextRCNN三种算法实现中文文本分类。 项目地址&#xff1a;zz-zik/NLP-Application-and-Practice: 本项目将《自然语言处理与应用实战》原书中代码进行了实现&#xff0c;并在此基础…

Unity使用DOTween实现分段进度条

文章目录 需求下载安装 DOTween实现实现效果 需求 用组件进度条&#xff08;Slider&#xff09;&#xff0c;利用分段加载进行以假乱真的进度效果&#xff0c;比如说2秒钟到达20%的进度&#xff0c;10秒钟加载20%到50%进度&#xff0c;1分钟加载50%到90%的进度&#xff0c;30秒…

2023年金融信创行业研究报告

第一章 行业概况 1.1 定义 金融信创是指在金融行业中应用的信息技术&#xff0c;特别是那些涉及到金融IT基础设施、基础软件、应用软件和信息安全等方面的技术和产品。这一概念源于更广泛的“信创 (信息技术应用创新)”&#xff0c;即通过中国国产信息技术替换海外信息技术&a…

77 组合问题

给定两个整数 n 和 k&#xff0c;返回 1 ... n 中所有可能的 k 个数的组合。 class Solution { private: vector<vector<int>> result; // 存放符合条件结果的集合 vector<int> path; // 用来存放符合条件结果 void backtracking(int n, int k , int st…

测试在 Oracle 下直接 rm dbf 数据文件并重启数据库

创建一个新的表空间并创建新的用户&#xff0c;指定新表空间为新用户的默认表空间 create tablespace zzw datafile /oradata/cesdb/zzw01.dbf size 10m;zzw用户已经创建过&#xff0c;这里修改其默认表空间 alter user zzw quota unlimited on zzw; alter user zzw default …

ELK企业级日志分析平台——logstash

部署 新建一台虚拟机elk4部署logstash [rootelk4 ~]# yum install -y jdk-11.0.15_linux-x64_bin.rpm[rootelk4 ~]# yum install -y logstash-7.6.1.rpm 命令方式 [rootelk4 bin]# /usr/share/logstash/bin/logstash -e input { stdin { } } output { stdout {} } elasticsearc…

使用骨传导耳机会伤耳朵吗?一文读懂骨传导耳机有哪些优点

首先说明&#xff0c;如果是正确的使用骨传导耳机是不会伤耳朵。 一、骨传导耳机的传声原理是什么&#xff1f; 声音的传播需要介质&#xff0c;传统的耳机是通过空气来进行传播&#xff0c;也被称为“空气传导耳机”&#xff0c;而骨传导耳机最大的特别之处就在于&#xff0…

AcWing 3384:二叉树遍历(依先序序列建树,输出中序序列) ← DFS

【题目来源】https://www.acwing.com/problem/content/3387/【题目描述】 编写一个程序&#xff0c;读入用户输入的一串先序遍历字符串&#xff0c;根据此字符串建立一个二叉树&#xff08;以指针方式存储&#xff09;。 例如如下的先序遍历字符串&#xff1a;abc##de#g##f###&…