Skip to content

关于 2018-04-08 移动端适配常识中的根元素 font-size 大小问题 #23

@jermyn626

Description

@jermyn626

文中「rem配合font-size布局」处,提到根元素 <html> 的 font-size 的大小(基准值)公式:

基准值 = document.documentElement.clientWidth * dpr / 10

这里本人做了测试,如果 <head> 中已经添加了 viewport 的 meta 标签,document.documentElement.clientWidth 这个值是进行缩放后的值。

以 iPhone6 为例,该设备的屏幕宽度为 375,dpr 为 2。 页面未添加 viewport 的 meta 标签之前,document.documentElement.clientWidth 为 980,添加 <meta name="viewport" content="width=device-width, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no"> 之后,document.documentElement.clientWidth 为 750。

结论就是:根元素 <html> 的 font-size 的大小(基准值)的设置这里是不需要再乘 dpr 的。
emmm,这是我对该文章的思考,就这样。

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions