什么是initial-scale = 1.0？

Question

我无法找到initial-scale=1.0和initial-scale=2.0含义的确切定义。

他们俩意味着什么？

我知道initial-scale与缩放有关，我只是不知道1-10的意思是什么。

来源：https://www.w3.org/TR/css-device-adapt-1/#translate-meta-to-at-viewport

Answer 1

通常的移动响应网站会在头部包含一个HTML元标记，如下所示：

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

在标记内，width属性控制视口的大小。它可以设置为像width = 400这样的精确像素数，也可以设置为特殊值device-width值，这是CSS像素中屏幕宽度的100％。 device-width是响应式网站最常用的宽度，可扩展到不同的屏幕尺寸。

首次加载页面时，initial-scale属性控制初始缩放级别，即1个视口像素= 1个CSS像素。 User-scalable，maximum-scale和minimum-scale属性控制用户如何缩放或缩小网页。

您可以设置示例html页面并包含viewport标记并更改initial-scale属性以查看差异。还可以尝试在不同的视口大小和方向上查看页面。

  

初始比例：访问页面时的初始缩放。 1.0不会缩放。

回答initial-scale = 2.0意味着这里是使用2.0的一个例子：

  

除上述内容外，您可能还需要指定查看区域的初始缩放系数。如果要将页面的视口设置为等于设备的宽度，并将其默认放大，例如，系数为2，则此属性将派上用场。该代码如下：

     

上面的图片显示了它的外观 - 尽管它并不是初始比例设置必须提供的可能性的特别实际的证明，但基本点应该是明确的：内容在第一时间被炸毁2倍负荷。

https://dev.opera.com/articles/an-introduction-to-meta-viewport-and-viewport/#initial-scale

对结帐的一些很好的参考： https://css-tricks.com/snippets/html/responsive-meta-tag/ https://css-tricks.com/probably-use-initial-scale1/

Answer 2

我浏览了一本旧书，找到了价值观的答案。我无法使用更官方的资源（例如W3C）验证它。

initial-scale的可能值范围介于10％ - 1000％或0.1 - 10.0之间。

0.1 = 10％缩放

0.2 = 20％缩放

...

1.0 = 100％

2.0 = 200％

...

10.0 = 1000％

我还没有在实际设备上测试这些。