微信小程序---view标签中内容居中

在有些时候我们需要view里的内容水平居中,或者垂直居中,又或者水平垂直居中,

最近我就在项目中需要设置view内 文字 和图片 垂直居中

下面直接看代码:

.wxml代码:

<view class="weui-tab__content_title" >
      <text style='padding-left: 17px;'>选项一的大标题</text>
      <image src="./navigator-images/u16.png" style=";padding-left: 55%; vertical-align: middle;width:10px; height: 15px;" ></image>
</view>

.wxss代码:

.weui-tab__content_title{
    display: flex;    /*设置显示样式**/
    align-items: center;    /**子view垂直居中*/
    vertical-align: center; /**垂直居中*/
    justify-content: center; /**内容居中*/
    flex-direction:row; 子view排列方式row--水平 column--垂直
    
}

猜你喜欢

转载自blog.csdn.net/qq_38538004/article/details/81564031
今日推荐