方法有两种:

一:采用css的zoom属性

zoom缩放会将元素保持在左上角,并且会有毛边,可能会稍稍改变元素原来的形状。

二:采用css3的transform:scale属性

zoom缩放会将元素保持在中间,不会改变元素原来的形状,但是可能会有稍稍的模糊。

整体来说zoom属性与transform:scale属性主要存在如下几点差异

1、zoom的缩放是相对于左上角的;而scale默认是居中缩放;
2、zoom的缩放改变了元素占据的空间大小;而scale的缩放占据的原始尺寸不变,页面布局不会发生变化;
3、zoom和scale对元素的渲染计算方法可能有差异(需要自己动手,用高清图,仔细去看其中的区别)。
4、对文字的缩放规则不一致。zoom缩放依然受限于最小12像素中文大小限制;而scale就是纯粹的对图形进行比例控制,文字50%原来尺寸。

最后Anne在这里建议大家如果需要在小程序开发中修改单选框和复选框大小最好采用transform:scale属性,因为采用css的zoom属性时,形状被改变的有些明显,体验很不好。

微信小程序-修改单选框和复选框大小的方法的更多相关文章

  1. 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

    参考文章: 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

  2. 微信小程序之自定义select下拉选项框组件

    知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件, ...

  3. CSS学习笔记三:自定义单选框,复选框,开关

    一点一点学习CCS,这次学习了如何自定义单选框,复选框以及开关. 一.单选框 1.先写好body里面的样式,先写几个框 <body> <div class="radio-1 ...

  4. 自动化测试-15.selenium单选框与复选框状态判断

    本篇主要介绍单选框和复选框的操作 一.认识单选框和复选框 1.先认清楚单选框和复选框长什么样 2.各位小伙伴看清楚哦,上面的单选框是圆的:下图复选框是方的,这个是业界的标准,要是开发小伙伴把图标弄错了 ...

  5. 2.12 单选框和复选框(radiobox、checkbox)

    2.12 单选框和复选框(radiobox.checkbox) 本篇主要介绍单选框和复选框的操作一.认识单选框和复选框    1.先认清楚单选框和复选框长什么样 2.各位小伙伴看清楚哦,上面的单选框是 ...

  6. Selenium2学习(十五)-- 单选框和复选框(radiobox、checkbox)

    本篇主要介绍单选框和复选框的操作 一.认识单选框和复选框 1.先认清楚单选框和复选框长什么样 2.各位小伙伴看清楚哦,上面的单选框是圆的:下图复选框是方的,这个是业界的标准,要是开发小伙伴把图标弄错了 ...

  7. HTML--使用单选框、复选框,让用户选择

    在使用表单设计调查表时,为了减少用户的操作,使用选择框是一个好主意,html中有两种选择框,即单选框和复选框,两者的区别是单选框中的选项用户只能选择一项,而复选框中用户可以任意选择多项,甚至全选.请看 ...

  8. Selenium3+python自动化 单选框和复选框

    一.认识单选框和复选框 1.先认清楚单选框和复选框长什么样 2.各位小伙伴看清楚哦,上面的单选框是圆的:下图复选框是方的,这个是业界的标准,要是开发小伙伴把图标弄错了,可以先抽他了. 二.radio和 ...

  9. radio(单选框)/checkbox(复选框) 美化

    由于某种原因,可能需要对单选框(radio)或复选框(checkbox)进行美化,那么直接修改样式是行不通,要实现就需要添加js,以下js依赖于jquery radio.js: function ra ...

随机推荐

  1. Arc082_F Sandglass

    Description有一个沙漏由两个上下相通玻璃球$A$和$B$构成,这两个玻璃球都含有一定量的沙子,我们暂且假定$A,B$中位于上方的玻璃球的为$U$,下方的玻璃球为$L$,则除非$U$中没有沙子 ...

  2. Gym - 100570C: Subrect Query (巧妙的单调队列)

    De Prezer loves rectangles.He has a n × m rectangle which there is a number in each of its cells. We ...

  3. 洛谷 P1187 3D模型

    题目描述 一座城市建立在规则的n×m网格上,并且网格均由1×1正方形构成.在每个网格上都可以有一个建筑,建筑由若干个1×1×1的立方体搭建而成(也就是所有建筑的底部都在同一平面上的).几个典型的城市模 ...

  4. Linux IO实时监控iostat命令详解(转)

    简介 iostat主要用于监控系统设备的IO负载情况,iostat首次运行时显示自系统启动开始的各项统计信息,之后运行iostat将显示自上次运行该命令以后的统计信息.用户可以通过指定统计的次数和时间 ...

  5. Angular面试题

    1. ng-show/ng-hide 与 ng-if的区别? 我们都知道ng-show/ng-hide实际上是通过display来进行隐藏和显示的.而ng-if实际上控制dom节点的增删除来实现的.因 ...

  6. DBVisualizer Pro for mac

    公司使用的是DB2数据库,支持DB2的数据库客户端常用的有DBeaver和DBVisualizer.DBeaver是免费的,但本人电脑安装后,启动一直报错,问题一直没解决就放弃了.改用DBVisual ...

  7. Hive之数据查询

    Hive之数据查询 发布于:2013 年 10 月 11 日 由 Aaron发布于: Hive 一,排序和聚合 对于排序有两种方式,一种是order by 一种是sort by order by 会对 ...

  8. Hive Joins 用法与操作

    Hive表连接的语法支持如下: join_table: table_reference JOIN table_factor [join_condition] | table_reference {LE ...

  9. 6 大主流 Web 框架优缺点对比:15篇前端热文回看

    摘自:http://blog.csdn.net/VhWfR2u02Q/article/details/78993079 注:以下文章,点击标题即可阅读 <6 大主流 Web 框架优缺点对比> ...

  10. POJ 1601 拓展欧几里得算法

    学习链接:http://www.cnblogs.com/frog112111/archive/2012/08/19/2646012.html 先来学习一下什么是欧几里得算法: 欧几里得原理是:两个整数 ...