ios - 使用媒体查询检测 Mobile Safari 全屏模式

Question

iOS6 为 Mobile Safari 引入了新的全屏模式。它仅适用于横向并隐藏浏览器顶部和按钮栏，以及设备状态栏。

如何使用媒体查询检测新模式？我尝试使用宽度媒体查询，但无法正常工作。

我能够使用 JS 来区分它们document.documentElement.clientHeight，它在默认情况下返回208，在全屏模式下返回 320。

顺便说一句：我不是在谈论从主屏幕启动应用程序，这是一种不同的全屏模式。

Answer 1

因此，高度为 320 像素，方向为横向。这是媒体查询：

@media only screen and (height : 320px) and (orientation : landscape) {
    /* rules here */
}