目前移动端在项目使用的rem,安卓手机上line-height属性,让它的值等于height,结果发现是不居中的。

出现此问题的原因是Android在排版计算的时候参考了primyfont字体的相关属性(即HHead Ascent、HHead Descent等),而primyfont的查找是看`font-family`里哪个字体在fonts.xml里第一个匹配上,而原生Android下中文字体是没有family name的,导致匹配上的始终不是中文字体,所以解决这个问题就要在`font-family`里显式申明中文,或者通过什么方法保证所有字符都fallback到中文字体。

解决方法:

1、添加border相关属性:

  • border: 1px solid transparent;

2、针对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,这个字体非常丑。

3、针对MIUI 8.0+设备:

  • 设置 font-family: miui 。这个方案就是显式申明中文的方案,MIUI在8.0+上内置了小米兰亭,同时在fonts.xml里给这个字体指定了family name:miui,所以我们可以直接设置。

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

  1. 移动端H5开发遇到的问题及解决方法

    本篇文章给大家带来的内容是关于移动端H5开发遇到的问题及解决方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 微信分享签名错误invalid signature vue单页应用hi ...

  2. ffmpeg按比例缩放--"width / height not divisible by 2" 解决方法

    最近在处理视频的时候,有这么一个需求 如果视频的分辨率宽度大于960的话,就把宽度设为960,而高度按其比例进行缩放 如果视频的分辨率高度大于540的话,就把高度设为540,而宽度按其比例进行缩放 之 ...

  3. 记录vue用 html5+做移动APP 用barcode做扫一扫功能时安卓 的bug(黑屏、错位等等)和解决方法

    最近做项目时,要用到扫一扫二维码的功能,在html5+里面有提供barcode功能,于是照过来用了, 写的代码如下 : 扫码页面: <style lang="less" sc ...

  4. table和div设置height:100%无效的完美解决方法

    刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:"100%"也无效,为什么会这样呢 ...

  5. Jenkins打包安卓时提示没同意constraintLayout的license的解决方法

    使用Jenkins打包安卓项目时,报错并失败,错误信息: You have not accepted the license agreements of the following SDK compo ...

  6. Flutter打包release版本安卓apk包真机安装无法请求网络的解决方法

    今天flutter build apk打包了一个release.apk包,在真机上安装后网络数据都不显示,但是在模拟器上没问题,然后又连接真机开debug各种测试,一切都正常!那这会是什么问题呢? 查 ...

  7. 移动端页面输入法挡住input输入框的解决方法

    1,宽高用了百分比或者vw/vh布局的,input输入框的最外层父容器的可用JS动态设置为当前窗口的宽高(防止输入法的弹出令页面变形) 2,最外层父容器用了fixed定位的,不要用top:0;要用bo ...

  8. 小程序安卓端播放不了音频解决方法wx.createInnerAudioContext()

    在小程序播放音频时,使用组件wx.createInnerAudioContext(),安卓端无法播放音频. 我的情况:播放服务器上传来的音频,格式为mp3.首先查看你的格式是否符合文档要求 在安卓端进 ...

  9. 安卓移动端line-height垂直居中出现偏移的原因,及解决方法

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

随机推荐

  1. Java——几点重要知识笔记(一)

    学了Java有一段时间了,自认为有一些基础知识比较重要,因此记下来共享,不喜勿喷. 一.标识符 (1)定义:在Java语言中,凡是对类,方法,变量,包,参数等命名时,所使用的字符序列 (2)包含的内容 ...

  2. 涨姿势了解一下Kafka消费位移可好?

    摘要:Kafka中的位移是个极其重要的概念,因为数据一致性.准确性是一个很重要的语义,我们都不希望消息重复消费或者丢失.而位移就是控制消费进度的大佬.本文就详细聊聊kafka消费位移的那些事,包括: ...

  3. 基于flask的城市空气质量分析系统

    1.1  系统功能 在对主要需求进行分析后,确定系统由以下几个模块组成. 1) 用户信息管理: 该部分主要完成系统管理员的增加.删除.编辑和访问控制权限等操作. 2) 数据管理: 该部分主要完成后台存 ...

  4. 三文搞懂学会Docker容器技术(下)

    接着上面一篇:三文搞懂学会Docker容器技术(上) 三文搞懂学会Docker容器技术(中) 7,Docker容器目录挂载 7.1 简介 容器目录挂载: 我们可以在创建容器的时候,将宿主机的目录与容器 ...

  5. java基础-java与c#的可变参数

    正文 可变参数,必须最为参数的最后一个参数:可变参数只能有一个: c#可变参数例子:       class Program { static void Main(string[] args) { T ...

  6. 入门大数据---Spring+Mybatis+Phoenix整合

    一.前言 使用 Spring+Mybatis 操作 Phoenix 和操作其他的关系型数据库(如 Mysql,Oracle)在配置上是基本相同的,下面会分别给出 Spring/Spring Boot ...

  7. Spring WebFlux 01 (原理及使用场景)

    一.什么是 Spring WebFlux 好多人以为Spring WebFlux就是Spring MVC的升级版,其实不然,那到底什么是Spring WebFlux呢,首先就要搞清楚Spring We ...

  8. .NET Core控制台利用【Options】读取Json配置文件

    创建一个 .NET Core控制台程序 添加依赖 Microsoft.Extensions.Configuration Microsoft.Extensions.Configuration.FileE ...

  9. 《UNIX环境高级编程》(APUE) 笔记第五章 - 标准I/O库

    5 - 标准I/O库 Github 地址 1. 标准 I/O 库作用 缓冲区分配 以优化的块长度执行 I/O 等 使用户不必担心如何选择使用正确的块长度 标准 I/O 最终都要调用第三章中的 I/O ...

  10. 半导体质量管理_Stargate

    监控您的SPC活动 生产质量指标概述 应定期评估统计信息,以便您可以更好地利用统计过程控制.通过这种方式,您可以快速发现质量缺陷并采取适当的措施做出反应.LineWorks STARGATE提供了生产 ...