iOS Safari上的图片大小增加了一倍

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。