Question

在我的Safari的iPhone 7中，3英寸宽的div实际约为1.8英寸。

为什么不设置devicePixelRatio，使CSS中的3in实际上是3in？有关于如何设置devicePixelRatio的规范吗？有解决方法吗？

 <!DOCTYPE html>
 <html>
    <head>
        <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
    </head>
    <body style="margin:0">
        <div style="width:3in;background:orange">3in</div>
    </body>
 </html>

Answer 1

不建议使用诸如英寸和厘米之类的CSS单位according to w3.org，除非您打算打印出网页：

如果需要确保打印的字体正好是特定大小，则唯一可以使用pt（或cm或in）设置字体大小的地方是用于打印的样式表。但是即使使用默认字体大小通常也更好。

如果您确实需要使用英寸作为单位，请查看此答案here

iPhone 7上的devicePixelRatio

1 个答案: