收藏
回答

view标签文本垂直居中的问题

不管是flex布局还是line-height布局,view在真机上都不能垂直居中,而button可以。但是官方button默认样式又一堆,能不能把view兼容性改好?

回答关注问题邀请回答
收藏

2 个回答

  • lzq
    lzq
    2018-09-26

    <!--  pages/login/login.wxml -->

    <view class='view-table' >

      <view class='view-cell' >

        <label>帐号</label>

        <input type='text' placeholder='请输入会员帐号' ></input>

        <label>密码</label>

        <input type='password' placeholder='请输入登录密码' ></input>

        <button>登录</button>

      </view>

    </view>


    /* pages/login/login.wxss */

    view{

      border: 0px solid red;

      width:97%;

      height:1200rpx;

      padding: auto;

      margin: auto;

      text-align: center;

      vertical-align: middle;

    }


    .view-table{

      display:table;

    }


    .view-cell{

      display:table-cell;

      width:800rpx;

    }


    input{

      border: 1px solid red;

      margin:30px;

      height:60px;

    }


    2018-09-26
    赞同
    回复
  • 上山打老虎
    上山打老虎
    2018-07-06

    设置个高度然后line-height写一样可以么?

    2018-07-06
    赞同
    回复 4
    • 东流
      东流
      2018-07-06

      工具上可行,真机实测还是有差距,button里面就很好

      2018-07-06
      回复
    • 上山打老虎
      上山打老虎
      2018-07-06回复东流

      那你把高度不设置固定值,用行高去撑开view看看能不能行。你记得把view边块元素

      2018-07-06
      回复
    • 东流
      东流
      2018-07-06回复上山打老虎

      外框有固定高度的,而且关键是button标签就没有这个问题,不想用button

      2018-07-06
      回复
    • 上山打老虎
      上山打老虎
      2018-07-06回复东流

      不太清楚了,等别人看有没有更好的处理方法吧

      2018-07-06
      回复
登录 后发表内容