Question

我制作了一个非常简单的网站www.abasi.info/viewport

包括：

<!DOCTYPE html>

<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>

<p><img alt="18" src="18.gif" style="height:55px; width:550px;"></p>



</body>
</html>

这些数字应该会持续到18岁。但是使用我的Android手机（版本2.3.6），视口无法调整。它放大了很多。我只是在网站上有这张照片（没有别的）。如果上面的视口可以工作，它将显示图片中的所有数字，直到18.这是非常奇怪的。

Answer 1

你需要使图像100％宽度和自动高度，所以比率不会搞砸。

示例 -

img{
    width:100%;
    height:auto;
}

http://jsfiddle.net/1n9jnaxw/

您也可以使用最大宽度，但请务必先定义图像尺寸。

要将视口限制为550px，您必须将其更改为 -

<meta name="viewport" content="width=550, maximum-scale=1, user-scalable=no">

Viewport不再工作了

1 个答案: