最近开发移动端APP,发现安卓端对于文字垂直居中的问题兼容性不好,网上也搜了很多方法,但是都比较麻烦,自己摸索出来了最终的解决方案: 1、首先在html头部把我们常用的lang="en"改为lang="zh-cmn-Hans"。

此设置会导致安卓端和iOS端的密码输入符会出现问题: iOS端:(密码符号变大) 图片描述 安卓端:(密码符号变小) 图片描述 我们可以对需要密码框的页面单独使用lang="en"的设置。 2、其次将中的font-family中设置的文字样式只保留以下两个: font-family: -apple-system-font, sans-serif; 并将 Helvetica,Arial等字体删除,这些字体是造成安卓端文字无法垂直居中的主要原因。 当然删除这些字体会带来页面中的数字会发生变化: 这是不设置Helvetica等字体的数字样式: 图片描述 这是设置了Helvetica等字体的数字样式: 图片描述 因此我们若要处理一些重要的数字时,可以单独对其设置字体样式。 最后附上按照我的方法处理前后的两张截图: 处理前: 图片描述 处理后: 图片描述 处理后,我的积分和签到 +5积分均处于垂直居中状态。 PS:此方法并不能解决移动端font-size小于12px以下出现的不能垂直居中问题。可能还需要各位用其它方式来解决。

关于移动端文字无法垂直居中(或line-height不起作用)的问题的解决方案(网摘)的更多相关文章

  1. Android进阶(二十二)设置TextView文字水平垂直居中

    设置TextView文字水平垂直居中 有2种方法可以设置TextView文字居中: 一:在xml文件设置:android:gravity="center" 二:在程序中设置:m_T ...

  2. 移动端重构实战系列2——line list

    这个line list的名字是我自己起的(大概的意思是单行列表),要实现的东西为sheral的line list,对应的scss组件为_line-list.scss,下图为line-list的一个缩影 ...

  3. 移动端 line-height 不垂直居中问题

    本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记 一般情况下, 我们把 line-height 的值设置为 height 的 ...

  4. WPF TextBox控件中文字实现垂直居中

    TextBox纵向长度比较长但文字字体比较小的时候,在输入时就会发现文字不是垂直居中的. 而使用中我们发现,TextBox虽然可以设置文字的水平对齐方式,但却没有相应的属性让我们来调节他的垂直对齐方式 ...

  5. web端文字转语音的几种方案

    最近在开发一个微信排队取号的的系统,其中对于服务员端(管理端) 需要有呼叫功能,即点按钮 就播出"xxx号顾客请就座"的声音. 经过在网上一番搜索研究,web端实现指定文字的语音播 ...

  6. 微信小程序文字水平垂直居中对齐问题

    我们知道常用的居中对齐方式有很多种例如: text-align:center; align-items:center; justify-content: center; margin: auto; # ...

  7. DIV文字水平垂直居中的方法

    水平居中 text-align:center 垂直居中(vertical-align) vertical-align:middle; vertical-align时而没效果 然而真实使用的时候,我们会 ...

  8. pc端常见布局---垂直居中布局 单元素定高

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 多行文字的垂直居中或高度不同的图片垂直居中---:after伪类+content

    如何让多行文字垂直居中?或者如何让图片垂直居中? 1.demo--css .box { width: 300px; height: 300px; background-color: #f5e79e; ...

随机推荐

  1. bzoj1143/2718 祭祀river(最大独立集)

    [CTSC2008]祭祀river Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 2175  Solved: 1098[Submit][Status] ...

  2. css的部分应用示例

    CSS :层叠样式表,Cascading Style Sheets.CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化. 1 vertical-align 在图片与文字对 ...

  3. php--strlen()与mb_strlen的作用与区别

    在PHP中,strlen与mb_strlen是求字符串长度的函数PHP内置的字符串长度函数strlen无法正确处理中文字符串,它得到的只是字符串所占的字节数.对于GB2312的中文编码,strlen得 ...

  4. sql server2008 R2安装总结

    1,卸载注意 在卸载Microsoft SQL Server 2008 R2 安装程序(简体中文) 出现 :“警告 26003.无法卸载 Microsoft SQL Server 2008 R2 安装 ...

  5. Boost Asio介绍--之一

    原文:http://www.tuicool.com/articles/YbeYR3 Boost Asio介绍--之一 时间 2014-03-26 17:57:39  CSDN博客 原文  http:/ ...

  6. 关于main()

    1.在c语言中: int main( void ) int main( int argc, char *argv[] ) 如果不需要从命令行中获取参数,请用int main(void) :否则请用in ...

  7. 基于python脚本的对拍debug

    首先,这是python脚本 import os; for i in range(0,20): print ("Case:"+str(i)); print ("random ...

  8. 获取非行间样式getComputedStyle

    有如下代码: 1 2 3 div {     width: 200px; } 1 2 3 <div id="aa" style="height: 100px;&qu ...

  9. filter 中用spring StopWatch 监控请求执行时间

    在filter中用spring stopWatch 来统计每个请求的执行时间: 虽然在firefox 中可以清楚的看到每个请求的执行时间,但是为了测试,记录日志, 方便以后查询维护. 还是必要的,下面 ...

  10. SpringMVC整合fastdfs-client-java实现web文件上传下载

    原文:http://blog.csdn.net/wlwlwlwl015/article/details/52682153 本篇blog主要记录一下SpringMVC整合FastDFS的Java客户端实 ...