IOS字体与安卓字体渲染不一致

IOS字体与安卓字体渲染不一致

问题:

前端开发中经常会遇到各种各样的兼容问题,记录一次IOS字体与安卓字体渲染不一致,当字体包名字中包含’-Bold’时

错误代码如下:

font-family:  DINAlternate-Bold ;
font-weight: bold;

IOS:

不会渲染’font-weight: bold’只是加载了’DINAlternate-Bold’字体包

​

安卓:

字体包本身为粗体(Bold),又渲染一次’font-weight:bold’导致加粗

​

解决方法:

1. 统一用Bold字体包,或者用标准字体包手动加粗

font-family:  DINAlternate-Bold ;
/* font-weight: bold; */

2. 询问相关开发,是否开发环境做有字体引入限制.

总结:

遇到这个问题的时候,一直以为是引入出了问题.但是IOS却能正常显示,所以证明引入没有问题.

问了同事发现是开发环境引入字体包有问题.

因Ios内置了字体,所以可以正常显示,安卓没有内置字体且环境内没有,所以无法生效.