原文地址:https://segmentfault.com/a/1190000021557598
作者:Fw恶龙
本文首发于:思否
1. 需求
- 使用line-height垂直居中单行文字;
- 使用伪元素vertical-align: middle;来垂直居中图片;
2. 遇到的坑
在安卓手机上用以上方法垂直居中的文字及图片都偏上。
3. 问题
导致这个问题的本质原因可能是 Android 在排版计算的时候参考了primyfont字体的相关属性(即HHead Ascent、HHead Descent等),而primyfont的查找是看font-family
里哪个字体在fonts.xml里第一个匹配上,而原生Android下中文字体是没有family name的,导致匹配上的始终不是中文字体,所以解决这个问题就要在font-family
里显式申明中文,或者通过什么方法保证所有字符都fallback到中文字体。
4. 解决
为 html 标签添加 lang="zh-CN" 属性,该属性值只针对中文页面,外文页面设置其他对应属性值。可用安卓手机查看以下栗子复现:
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。