viewport meta 标记

在移动端网页开发中，viewport meta 标记是优化显示效果的关键。它定义了浏览器可视区域的宽度和缩放比例，常用于适配不同设备屏幕。

默认情况下，移动浏览器会将网页放入一个虚拟的 viewport（如 980px），然后缩放到设备屏幕（如 375px），导致内容显得很小。例如，一个宽度为 460px 的图片，在未设置 viewport 时会被压缩到约 176px，不占满屏幕。

通过添加 ，viewport 宽度变为设备宽度（如 375px），初始缩放为 1。此时，若图片宽度固定为 460px，会超出屏幕；但结合 CSS（如 width: 100%），图片即可适配设备宽度，占满屏幕。

简而言之，viewport meta 标记通过控制 viewport 大小，确保网页布局与设备屏幕匹配，是响应式设计的基础。