1

我读了这篇文章两个视口的故事

在这篇文章中,作者写道:

“CSS 布局,尤其是百分比宽度,是相对于布局视口计算的”

“重点是:浏览器选择了布局视口的尺寸,使其在完全缩小模式下完全覆盖屏幕(因此等于视觉视口)。”

我不明白以下段落:

“现在你可以尝试设置 html {width: 320px}。现在元素缩小了,所有其他元素也随之缩小,现在占 320px 的 100%。当用户放大时,这有效,但最初,当用户面临一个缩小的页面,其中大部分内容都没有”

如果设备的屏幕大小约为 320 像素,布局视口也是如此,如果 html 元素的 css 宽度设置为 320px,为什么元素会缩小?

谢谢

在此处输入图像描述

4

1 回答 1

4

如果设备的屏幕大小约为 320 像素,布局视口也是如此,如果 html 元素的 css 宽度设置为 320px,为什么元素会缩小?

如果您不使用元标记<meta name="viewport" content="width=device-width">(或任何附加项)重置它,您的移动设备上的默认视口为 ca 980px 。

移动浏览器会自动缩放您的页面,使 980 像素的大小适合屏幕,使您的 320 像素只有三分之一。

于 2012-05-29T12:49:59.263 回答