目前在移动端安卓手机上使用line-height属性，让它的值等于height，结果发现是不居中的。出现了一定位置的偏移情况，如果略微只有两三个像素差距是看不出来的。

左图中的字号是12px，右图中的行高是26px。仔细观察过上图后，闲话少扯，直接说说我对这个android上line-height问题的一些看法：

  1. 字体大小不要使用奇数字号，带小数点的更不要提了。也就是说被2整除的整数且不可小于12px。
  1. 尽量不要使用rem或者em的单位，除非你能对字号的把握在每个手机上都能达到第1条的要求。别外，微信小程序上的rpx是动态计算的，可以单独针对这部分使用px。
  1. 一般只要不是边框贴着文字，一般都还看得过去，在接受的范围之内。如果是边框贴着文字，就是居中了，也不好看啊。

那么，对于小于12像素的居中或者是对居中要求很是严格的需求，这个问题怎么解决？

  1. 把字号内外边距等设置为需求大小的2倍，使用transform进行缩放。只能针对 单个或者是一排的布局进行缩放，如果是父级自适应高度且可展示多行的，使用transform是有问题的。因为transform缩放是不影响页面布局的。
  2. 把字号内外边距等设置为需求大小的2倍，使用zoom进行缩放，可以完美解决。zoom原本只有ie支持，但现在除了Firefox，都已经支持了。是的，Firefox不支持。

导致line-height偏移的本质原因 ：

作者：周祺，来源链接：https://www.zhihu.com/question/39516424/answer/274374076

是Android在排版计算的时候参考了primyfont字体的相关属性（即HHead Ascent、HHead Descent等），而primyfont的查找是看`font-family`里哪个字体在fonts.xml里第一个匹配上，而原生Android下中文字体是没有family name的，导致匹配上的始终不是中文字体，所以解决这个问题就要在`font-family`里显式申明中文，或者通过什么方法保证所有字符都fallback到中文字体。
  • 1.针对Android 7.0+设备：
  • <html>上设置 lang 属性：<html lang="zh-cmn-Hans">，同时font-family不指定英文，如 font-family: sans-serif 。这个方法是利用了浏览器的字体fallback机制，让英文也使用中文字体来展示，blink早期的内核在fallback机制上存在问题，Android 7.0+才能ok，早期的内核下会导致英文fallback到Noto Sans Myanmar，这个字体非常丑。
  • 针对MIUI 8.0+设备：
  • 设置 font-family: miui 。这个方案就是显式申明中文的方案，MIUI在8.0+上内置了小米兰亭，同时在fonts.xml里给这个字体指定了family name：miui，所以我们可以直接设置。

其它解决方法：

1.添加border相关属性：
 border: 1px solid transparent;

 box-sizing:border-box;

设计坞官网https://www.wode007.com/sites/73738.html

2.采用其它垂直居中方法：

安卓移动端line-height垂直居中出现偏移的原因，及解决方法的更多相关文章

  1. Eclipse、MinGW、JNI编写C++生成dll, Java端调用的完整示例(附java.lang.UnsatisfiedLinkError解决方法)

     Eclipse.MinGW.JNI编写C++生成dll, Java端调用的完整示例(附java.lang.UnsatisfiedLinkError解决方法) 问题背景:之前的JNI编程都是基于And ...

  2. 移动端H5页面中1px边框的几种解决方法

    问题提出 这是一个比较老的问题了,我第一次注意到的时候,是UI设计师来找我麻烦,emmm那时候我才初入前端职场,啥也不懂啊啊啊啊啊,情形是这样的:设计师拿着手机过来:这些边框都粗了啊,我的设计稿上是1 ...

  3. 移动端遇到的常见JS与CSS问题及解决方法

    由于笔者的水平有限,虽说都是笔者遇到过使用过的,但文中可能也会出现一些问题或不严谨的地方,望各位指出,不胜感激! 一. css部分 body如果设置height:100%;overflow:hidde ...

  4. 转：关于安卓多线程while(true)方法占用CPU高的原因及其解决方法

    由于项目需要用到安卓多线程操作,结果开了四条线程,下载到平板一直很卡,CPU占用率暴涨.于是开始查找原因,发现是线程run()方法里的while(true)导致的, 下图是为解决时开启一条while( ...

  5. [RabbitMQ]Windows环境下rabbitmqclt(Command Line Tools)出现Erlang distribution failed错误的解决方法

    摘要 当使用rabbitmqctl时出现Erlang distribution failed,把%SystemRoot%Windows\System32\config\systemprofile下的. ...

  6. 【H5-移动端开发】外部唤起本机APP的解决方法

    太长时间没来博客园,原因很简单啊--太懒了!罪过罪过~ 最近公司的APP项目开始运行,采用的是原生框架+内嵌H5页面.作为一个菜鸡前端,开始入手学习移动端的界面制作加载性能优化.由于公司开始推广软件, ...

  7. 移动端页头推荐配置 出现找不到favicon.ico错误原因和解决方法

    favicon 在未指定 favicon 时,大多数浏览器会请求 Web Server 根目录下的 favicon.ico .为了保证 favicon 可访问,避免404,必须遵循以下两种方法之一: ...

  8. eclipse报错：Multiple annotations found at this line: - String cannot be resolved to a type解决方法实测

    Multiple annotations found at this line:- String cannot be resolved to a type- The method getContext ...

  9. 安卓手机USB无法共享、上网或卡顿的解决方法

    安卓手机通过USB为电脑(Windows10)提供网络接入点时,系统程序会异常卡顿. 1)设备管理器2)点击“网络适配器”,在弹出的下拉列表中选择”Remote NDIS based Internet ...

随机推荐

  1. java实现人员排日程

    某保密单位机要人员 A,B,C,D,E 每周需要工作5天,休息2天. 上级要求每个人每周的工作日和休息日安排必须是固定的,不能在周间变更. 此外,由于工作需要,还有如下要求: 所有人的连续工作日不能多 ...

  2. java实现第七届蓝桥杯反幻方

    反幻方 题目描述 我国古籍很早就记载着 2 9 4 7 5 3 6 1 8 这是一个三阶幻方.每行每列以及对角线上的数字相加都相等. 下面考虑一个相反的问题. 可不可以用 1~9 的数字填入九宫格. ...

  3. 自动把网页px单位转换成rem

    自动把网页px单位转换成rem 首先在你的项目开发环境中安装2个插件 然后在vue.config.js文件引入并重新启动服务器 这样就配置成功了,一起看看效果

  4. 一篇文章快速搞懂 Atomic（原子整数/CAS/ABA/原子引用/原子数组/LongAdder）

    前言 相信大部分开发人员,或多或少都看过或写过并发编程的代码.并发关键字除了Synchronized,还有另一大分支Atomic.如果大家没听过没用过先看基础篇,如果听过用过,请滑至底部看进阶篇,深入 ...

  5. C#基础篇——委托

    前言 在本章中,主要是借机这个C#基础篇的系列整理过去的学习笔记.归纳总结并更加理解透彻. 在.Net开发中,我们经常会遇到并使用过委托,如果能灵活的掌握并加以使用会使你在编程中游刃有余,然后对于很多 ...

  6. 记 Centos zabbix-agent启动失败解决思路

    一. 环境介绍 系统版本:Centos7.4 zabbix-agent 版本:zabbix-agent 3.4.7 二. 问题现象 启动zabbix-agent时启动失败 查看zabbix-agent ...

  7. 实验四 Linux系统C语言开发环境学习

    项目 内容 这个作业属于哪个课程 Linux系统与应用 这个作业的要求在哪里 作业要求链接 学号-姓名 17041428-朱槐健 作业学习目标 1.Linux系统下C语言开发环境搭建 2.学习Linu ...

  8. bat 脚本定时删除备份文件

    删除 D:\yswbak 目录下rar类型 6天前的 文件 @echo off forfiles /p D:\yswbak /m *.rar /d -6 /c "cmd /c del @pa ...

  9. C#9.0 终于来了，带你一起解读Pattern matching 和 nint 两大新特性玩法

    一:背景 1. 讲故事 上一篇跟大家聊到了Target-typed new 和 Lambda discard parameters,看博客园和公号里的阅读量都达到了新高,甚是欣慰,不管大家对新特性是多 ...

  10. Redis学习笔记（二十一） 事务

    文章开始啰嗦两句,写到这里共21篇关于redis的琐碎知识,没有过多的写编程过程中redis的应用,着重写的是redis命令.客户端.服务器以及生产环境搭建用到的主从.哨兵.集群实现原理,如果你真的能 ...