uniapp改变radio大小-属性transform: scale()

简介: uniapp改变radio大小-属性transform: scale()

半年前使用uniapp+ColorUI+安卓写了一款app,最近在进行一些优化和修改,顺便记录一下遇到的一些小问题,遇到的一些可以记录下来的优化点,其实uniapp用来做一些比较简单的app还是挺不错的,比较快捷,容易管理~~


uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。

话不多说,今天遇到了一个小问题

在默认的radio选择框里面


我这里男生和女生的radio显得比较大,比字体都要大一点,看起来很不舒服。想要给调整小一点。一开始我就在上面加了一个宽度和高度,设置没有成功,没有反应。

后面翻看了一下官方文档,找到了一个比较简单的属性

style="transform: scale(0.77)"


于是找到代码

直接添加了这个属性

<view class="cu-form-group">
                <view class="title">性别</view>
                <radio-group @change="radioChange" style="transform: scale(0.77)">
                    <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in sex" :key="item.value">               
                            <radio style="margin-right:10px" :value="item.value" :checked="item.checked" /><span style="margin-right:10px">{{item.label}}</span>
                    </label>
                </radio-group>
            </view>

ok,保存代码

刷新之后会发现

radio大小就变小了

相关文章
|
6月前
|
前端开发
UniApp 中的 image 属性讲解
UniApp 中的 image 属性讲解
841 2
|
6月前
|
移动开发 JavaScript 小程序
uniapp中组件库的Radio 单选框丰富的使用方法
uniapp中组件库的Radio 单选框丰富的使用方法
683 0
|
6月前
|
Web App开发 小程序 Android开发
Uniapp from 表单组件 多层选择 开关 评分 滑块 步进器 日期框 级联选择 下拉列表 复选框 单选框 多行文本 单行文本 textarea radio checkbox picker
Uniapp from 表单组件 多层选择 开关 评分 滑块 步进器 日期框 级联选择 下拉列表 复选框 单选框 多行文本 单行文本 textarea radio checkbox picker
99 0
|
6月前
uniapp popup弹出窗详解以及相关属性
uniapp popup弹出窗详解以及相关属性
661 3
|
6月前
|
开发框架 JavaScript
uniapp使用u-empty以及其相关属性
uniapp使用u-empty以及其相关属性
474 1
|
6月前
|
前端开发
UniApp 中的 u-input 属性讲解
UniApp 中的 u-input 属性讲解
1166 0
|
4月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的房屋租赁App的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的房屋租赁App的详细设计和实现(源码+lw+部署文档+讲解等)
126 7
基于SpringBoot+Vue+uniapp的房屋租赁App的详细设计和实现(源码+lw+部署文档+讲解等)
|
4月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
62 7
|
4月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的宠物医院微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的宠物医院微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
81 7
|
4月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的武汉市公交路线查询系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的武汉市公交路线查询系统的详细设计和实现(源码+lw+部署文档+讲解等)
110 7

热门文章

最新文章