Rob*_*cha 10 html css media-queries
我无法找到关于什么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
Jam*_*esG 11
通常的移动响应站点将在头部包含HTML元标记,如下所示:
<meta name="viewport" content="width=device-width, initial-scale=1">
Run Code Online (Sandbox Code Playgroud)
在标记内,width属性控制视口的大小.它可以设置为像width = 400这样的精确像素数,也可以设置为特殊device-width值,它是CSS像素中屏幕宽度的100%.device-width是响应式网站最常用的宽度,可扩展到不同的屏幕尺寸.
首次加载页面时,initial-scale属性控制初始缩放级别,即1个视口像素= 1个CSS像素.User-scalable,maximum-scale以及minimum-scale属性控制用户如何能够缩放页面或缩小.
您可以设置示例html页面并包含视口标记并更改initial-scale属性以查看差异.还可以尝试在不同的视口大小和方向上查看页面.
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/
我浏览了一本旧书,找到了价值观的答案.我无法使用更官方的资源(例如W3C)对其进行验证.
可能的值范围initial-scale在10%-1000%或0.1-10.0之间.
0.1 = 10%变焦
0.2 = 20%变焦
...
1.0 = 100%
2.0 = 200%
...
10.0 = 1000%
我还没有在实际设备上测试这些.