width 属性控制视区的大小。可以将其设置为以CSS像素
响应式设计是否必须使用元标记视口？
<meta name="viewport" content="width=device-width,initial-scale=1">
我做过很少的测试，它在桌面浏览器上运行良好，并且它可以适当地适应窗口的大小，即使我使用视口作为宽度或高度来定义页眉和页脚。
那么，该元标记是否仅对移动设备有用，或者这是必要的？ 视口是否对移动设备使用默认宽度或高度？
如果未定义元标记，则定义了虚拟视口默认值。具有这些默认虚拟值的非移动优化网站在窄屏设备上通常看起来更好。
在 Safari iOS 上，默认宽度为 980 像素，其他浏览器的宽度大小相似或略小。
窄屏设备(例如移动设备)在虚拟窗口或视口(通常比屏幕宽)中呈现页面，然后缩小呈现的结果，以便可以一次看到所有内容。然后，用户可以平移和缩放以查看页面的不同区域。
例如，如果移动屏幕的宽度为 640px，则页面可能会使用 980px 的虚拟视口呈现，然后页面将缩小以适应640px的空间。
手机上带视口的宽度和高度的说明和默认值
苹果作为视口的发明者说，默认的视口设置是： 默认宽度为 980 像素。但是，这些默认值可能不适用于您的网页，尤其是在您为特定设备定制网站时。
Apple 配置视口和默认值
这是各种移动优化网站中使用的常见视口设置。
width 属性控制视区的大小。可以将其设置为以CSS像素
(“width=600”)的特定值。在这里，它被设置为一个特殊值(“width= device-width”)即设备的宽度，以 100% 的比例以 CSS 像素表示。初始缩放属性控制首次加载页面时的缩放级别。
注意：元标记应添加到HTML文档的头部标记中。
响应式标签具有以下属性：
width：设备虚拟视区的宽度。
height：设备虚拟视口的高度。
初始比例：首次访问页面时的缩放级别。
最小比例：用户可以缩放页面的最小缩放级别。
最大缩放：用户可以缩放页面的最大缩放级别。
用户可缩放：允许设备放大或缩小的标志。(值 = 是/否)。
参考： https://www.geeksforgeeks.org/html-viewport-meta-tag-for-responsive-web-design/