如果我们不使用 Bootstrap，我们的 HTML 页面的 <head> 中是否需要 <meta name="viewport" content="width=device-width, initial-scale=1.0">？
【问题讨论】：
标签： html twitter-bootstrap-3 metadata
是的。 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 与 Bootstrap 框架完全无关，应该出现在每个网页上，无论您使用什么框架。
viewport META tag 允许 device width 映射到 width CSS 属性，这实质上意味着设备像素正确映射到 CSS 像素，允许元素和字体在移动设备上正确缩放。没有这个，传统意义上的a pixel is not a pixel。
如果没有viewport META tag，您将很难确保您的网站在各种不同的移动设备上看起来都一样，因为大多数移动设备都有不同的视口。字体在一台设备上可能看起来太大，而在另一台设备上看起来又太小，即使使用基于百分比的测量单位也是如此。 Apple 已经 great documentation 在 Safari 中展示了这一点。
除此之外，Google 现在还通过 Lighthouse 为 viewport META tag 审核网站，并利用它将 improve your SEO：
为确保您的网站在所有移动设备上正确显示，请确保将viewport META tag 与包含width、initial-scale 或两者的content 结合使用。还可以使用 media queries 来微调响应式设计。
CSS Tricks 有 a helpful list 的断点，如果您正在寻找详细的移动优化，ViewportSizes 有一张表格，展示了 286 种不同的移动设备及其各自的视口大小以供参考。
【讨论】：