Question

我在iOS Safari上尝试以下HTML代码：

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <title>HTML5 test</title>
    </head>
<body>
    <img src="image.jpg" width="100" alt="Image" />
</body>
</html>

桌面浏览器看起来很好。但在iOS Safari（iOS 5，iPhone）上，图像宽度为200px。因为我使用了缩放1.0的视口，它应该是100px但它不是 - 任何想法为什么？

Answer 1

浏览器中的逻辑像素是两个实际屏幕像素，因为屏幕相对于其分辨率而言是如此之小。

使用比例1.0可以得到图像像素和逻辑像素之间的1对1关系，以及图像像素和实际屏幕像素之间的关系1到2。

iOS Safari上的图像大小加倍

1 个答案: