移动端相关技术说明

移动端页面字号说明

移动端大小适配方面，我们采用的技术是基于 iPhone 6 为标准尺寸，字号动态调整方案；

在 iPhone 6 环境下；按照设计稿中的 pt/px 转为 rem 相对单位。

基于 root 的字体大小，不同终端（分辨率）动态调整。即在不同分辨率下，字体的大小会等比调整。这样做的好处是，整段文字在不同分辨率的手机上是等比展现，而非完全相同。

如图：

iPhone 6 和 iPhone 6p 在 root 字体大小上分别为 10px 、11.04px

正是由于这个细微差距，则所有子元素的字体都会遵循该基础字号进行动态的比例调整。

如果不采用这样的技术，而是粗暴的使用固定 px 单位且不做媒体查询进行区别对待；则可能会出现，小屏手机字显大，大屏手机字显小，且由于相同字号但不同宽度导致的换行，造成样式上的差异等其他不可控渲染效果。

移动端页面字体说明

中文字体方面，使用我们定义好的黑体降级方案（英文字体会按设计稿定制显示）

分别为（有则优先显示，否则顺延）：

Apple System，Helvetica Neue，Helvetica，Nimbus Sans L，Arial，Liberation Sans，PingFang，冬青黑，思源黑体，微软雅黑，文泉驿微米黑，文泉驿正黑，华文黑体，中易黑体，文泉驿点阵正黑

项目介绍： https://code.mrdxs.com/toolbox/fonts.css
演示地址：http://zenozeng.github.io/fonts.css/