设置meta viewport标签为`height=device-height`的效果是什么？

Question

我了解iOS在处理“设备宽度”（device-width）方面的默认行为可能是尝试使用980px的视口宽度来渲染网站，设置“width=device-width”可能会很有用（特别是在开发Cordova/mobileApp/SPA时）。

然而，我不确定何时应该设置“height=device-height”。是否添加此行会产生任何影响？难道不是使用设备高度作为视口高度的默认行为吗？

我有一个移动应用程序，可作为移动网站和cordova本机应用程序提供。有两个不同设置（存留）的“index.html”页面：

// 移动网站有： // Cordova 有： 我想知道在两种情况下都使用相同的内容值（似乎主要是围绕“device-height”），我遇到的风险是什么。

我没有在这个主题上发现在线文档真的很有帮助。有什么想法吗？

- Sebastien Lorber

Answer 1

您提供的在线文档确实指向了规范：

https://drafts.csswg.org/css-device-adapt/#width-and-height-properties

device-width 和 device-height 分别转换为 100vw 和 100vh。

- Ernesto Ramírez Romero

---

但是我想知道的是，如果我们没有设置device-height，它的默认值是什么？ - Sebastien Lorber

从技术上讲，device-height 是一个值而不是属性。因此，您可以将 height 设置为 device-height 的值，否则 height 默认为 auto。更多信息请参见 https://drafts.csswg.org/css-device-adapt/#height-desc。 - Ernesto Ramírez Romero

是的，那是我的错误，我在谈论设置“height”。将其设置为“height=device-height”与不设置任何“height”值有什么影响？Auto =？ - Sebastien Lorber

将 height 设置为 device-width 可以确保您将视口设置为设备的高度，而不是渲染空间。它的行为与 width 完全相同。在我的项目中，似乎添加 width 就足够了，但如果您想要更明确，您总是可以选择更多选项。 - Ernesto Ramírez Romero

那么默认渲染空间的大小是多少？在iOS上不设置似乎意味着宽度将为980px。不设置device-height是什么意思？ - Sebastien Lorber