关于小程序中控件居中

使View组件居中的方法

1.将view组件设置

display:flex;
justify-content: center;

给个水平居中的实例
水平居中
tig:如果实现不了垂直居中,将view设为父控件,将子控件的布局设为绝对布局
在这里插入图片描述

position: absolute;

然后设置高度定位top: 450rpx;

做之前也上网查找过资料,网上关于垂直居中还有一种说法就是
display:flex; justify-content: center; align-items: center;
我自己实测的时候align-items:center并不起作用,希望有知道的大神能帮忙解惑一下。

wxml:

<view class="userinfo">
        <text class="userinfo-role" >认证等级</text>
</view>

wxss:

.userinfo {
  display: flex;
  justify-content: center;
}
.userinfo-role {
  position: absolute;
  top: 450rpx;
}

2.使用margin: 0 auto;效果图和方法1一样

猜你喜欢

转载自blog.csdn.net/qq_39558948/article/details/105126002
今日推荐