收藏
回答

第二次问:文字不垂直居中,求解决方案

问题模块 框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
API和组件 小程序 Bug view和text 客户端 6.53 1.73

第二次问了:文字不垂直居中,各种方法试遍,各种手机居中效果都不太一样,望官方早出解决方案。这是开发当中最痛苦的事情之一

最后一次编辑于  2018-05-19  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

21 个回答

  •           
              
    2018-05-19
    WXML :
    <view class='box'>
        <view>以下几种方法在很多种手机上居中的程度都不一样</view>
        <view>
            <view>1、方法一,苹果6偏上未完全居中,荣耀7无效</view>
            <text class='way'>限</text>
        </view>
        <view>
            <view>2、方法二,苹果6完全居中,荣耀7偏上未完全居中</view>
            <view class='way'>限</view>
        </view>
        <view>
            <view>3、方法三,苹果6完全居中,荣耀7无效</view>
            <view class='way'>限</view>
        </view>
    </view>
     
    WXSS :
    .box {
        display: flex;
        font-size: 28rpx;
        flex-direction: column;
    }
    .box .way {
        background-color: red;
        color: white;
        line-height: 60rpx;
        width: 60rpx;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    你是要所有文字垂直居中么?还是只要那个限字


    2018-05-19
    赞同
    回复 5
    • guo煊
      guo煊
      2018-05-22
      你好,限字居中
      2018-05-22
      赞同
      回复
    •           
                
      2018-05-22回复guo煊
      以上方法可以居中,你参考一下
      2018-05-22
      赞同
      回复
    • guo煊
      guo煊
      2018-05-22回复          
      好,我试试,谢谢
      2018-05-22
      赞同
      回复
    •           
                
      2018-05-22回复guo煊
      有用的话就过来扣1,没用的话你就把我的评论删掉
      2018-05-22
      赞同
      回复
    • guo煊
      guo煊
      2018-05-22回复          
      荣耀7没效果
      2018-05-22
      赞同
      回复
  • 程序猿-Mr.Zhang
    程序猿-Mr.Zhang
    2018-05-19

    效果图呢?

    2018-05-19
    赞同
    回复 1
    • guo煊
      guo煊
      2018-05-22
      可查看代码片段
      2018-05-22
      赞同
      回复
  • guo煊
    guo煊
    2018-05-22

    @狂禅 ̄,你给的方法在荣耀7上没效果啊


    2018-05-22
    赞同
    回复 5
    •           
                
      2018-05-22
      你再设置height: 60rpx;
      2018-05-22
      赞同
      回复
    •           
                
      2018-05-22
      把way样式中的下面三行删掉,换成text-align: center; line-height: 60rpx; height: 60rpx;
      2018-05-22
      赞同
      回复
    • guo煊
      guo煊
      2018-05-22回复          
      依然无效,跟上图效果一样
      2018-05-22
      赞同
      回复
    •           
                
      2018-05-22回复guo煊
      这不科学,你把我的评论删掉吧,当我没来过
      2018-05-22
      赞同
      回复
    • guo煊
      guo煊
      2018-05-22回复          
      不信的话,你可以拿个荣耀7的手机试试。总之,谢谢
      2018-05-22
      赞同
      回复
  • 北冥有池塘
    北冥有池塘
    2018-06-20

    我做的时候一直是动态拿到文字长度和高度然后计算位置的,你可以试试看

    2018-06-20
    赞同
    回复 3
    • guo煊
      guo煊
      2018-06-20

      请问如何动态计算?

      2018-06-20
      赞同
      回复
    • 北冥有池塘
      北冥有池塘
      2018-06-20回复guo煊

      有现成的api呀

      2018-06-20
      赞同
      回复
    • guo煊
      guo煊
      2018-06-20回复北冥有池塘

      这个似乎有些麻烦,而且低一点的版本是没有这个接口

      2018-06-20
      赞同
      回复
  • 土豆豆
    土豆豆
    2018-06-20

    居中这个问题本来在一些Android的烂手机上就有兼容问题,无解!!!

    2018-06-20
    赞同
    回复 1
    • guo煊
      guo煊
      2018-06-20

      可能真的是无解

      2018-06-20
      赞同
      回复
  • 云里雾里y
    云里雾里y
    03-14

    加个华为,苹果看似居中  华为怎样都不居中  还有其他安卓机型   也会有偏上或者偏下的问题,去看了别个京东或者其他的小程序   也没有做到居中

    03-14
    赞同
    回复