记录一下CSS设置文字水平垂直居中。
1、代码说明
对于直接在标签里面的文字,使用flex布局控制其中的文字水平和垂直居中
1.1、Html
<!-- pages/test/test.wxml -->
<view class='myText'>水平、垂直居中</view>
1.2、CSS
/* pages/test/test.wxss */
.myText{
/* 用弹性盒子设置居中 */
display: flex;
align-items: center;/* 垂直居中 */
justify-content: center;/* 水平居中 */
/* 为了看效果,设置背景色和尺寸 */
background-color: green;
width: 500rpx;
height: 500rpx;
}
}
2、效果
点个赞,一起加油啊!!!