安卓机 文字不能垂直居中

[lovelmh13]

没有边框的话 加上个透明边框:

border: 1px solid transparent; // 为了让安卓机文字可以垂直居中
box-sizing: border-box;

并且要把行高和文字调到适当大小 有的大小不合适不能居中

有的地方细看，还是没有那么居中，可能会差个1px的感觉，但是会比不处理好很多

[lovelmh13]

没有边框的话 加上个透明边框:

border: 1px solid transparent; // 为了让安卓机文字可以垂直居中
box-sizing: border-box;

并且要把行高和文字调到适当大小 有的大小不合适不能居中

有的地方细看，还是没有那么居中，可能会差个1px的感觉，但是会比不处理好很多

更新一下 上述方案不是很好使。
后来使用transform 缩放 方案得到解决：

出现问题的原因： 安卓 webview 的字体大小在小于 12 像素的时候无法使用行高来垂直居中

使用 transform: scale(0.5, 0.5); transform-origin: left top; 来做到居中（left top 看情况用），注意，缩放0.5的话，字体、宽高要变大一倍。定位要微调

<div class="solution" style="height: 32px; line-height: 32px; font-size: 20px; transform: scale(0.5, 0.5); transform-origin: left top;">
  <span>hot 热门</span>
</div>

还有内边距+行高normal 和 行高+字体大小initial的方法，但是我测试无效

<div class="solution" style="box-sizing: border-box; padding: 2px; line-height: normal; font-size: 10px;">
  <span>hot 热门</span>
</div>

<div class="solution" style="line-height: 16px; font-size: initial;">
  <span style="font-size: 10px;">hot 热门</span>
</div>

参考： 前端常见问题——安卓文本无法垂直居中