Question

我的网站宽度为2048像素。有没有办法在网站加载时自动让iPad适合屏幕上的整个网站宽度？我尝试过以几种不同的方式试验元视口：

<meta name="viewport" content="width=device-width maximum-scale=1.0">
<meta name="viewport" content="width=device-width initial-scale=1.0">

但这并没有奏效。该网站仍然太宽，并在iPad上的屏幕上溢出。

Answer 1

您可以将固定大小传递给内容宽度，如下所示：

<meta name="viewport" content="width=2048" />

可能需要进行一些调整以允许在任何一侧填充，但是应该以该大小加载网站并允许用户放大。

Answer 2

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

这就是我在网站上使用的内容。

Answer 3

解决此问题的正确方法是使用百分比而不是固定宽度。但是，如果您“无法”更改它，则可以通过在初始比例中使用0.x来强制视口缩小，例如：

<meta name="viewport" content="width=device-width, initial-scale=0.625, user-scalable=yes" />

Answer 4

尝试将min-width: 2048px;设置为css中的html和body标签。这对我来说固定在iPad上的一些奇怪之处，但不确定它是否适用于这个。

Answer 5

我最近在一个网站上遇到了同样的问题，对于固定的960px宽度网站，它不会在页面点击之间保持缩小状态。尝试：

<meta name="viewport" content="width=device-width, initial-scale=-100%" />

到目前为止一直很好，通过我的Ipad Air。

Answer 6

这很好用：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">

调整网站宽度以适应iPad屏幕的宽度

6 个答案: