uniapp改變radio大小-屬性transform: scale()

半年前使用uniapp+ColorUI+安卓寫了一款app,最近在進行一些優化和修改,順便記錄一下遇到的一些小問題,遇到的一些可以記錄下來的優化點,其實uniapp用來做一些比較簡單的app還是挺不錯的,比較快捷,容易管理~~

uni-app 是一個使用 Vue.js 開發跨平臺應用的前端框架,開發者編寫一套代碼,可編譯到iOS、Android、H5、小程序等多個平臺。

文檔:https://uniapp.dcloud.io/

話不多說,今天遇到了一個小問題
在默認的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大小就變小了


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章