Skip to content

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

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,这是我对该文章的思考,就这样。

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions