mobile-safari - iOS 15 浏览器CSS

Question

我安装了 iOS 15 beta 并在新的 Safari 更新上查看我的网站，我看到顶部标题显示灰色标题而不是透明地在缺口下流动等。

整个网站都是纯白色和黑色文本，所以我希望状态栏是透明的和黑色文本，以便网站完美融合。

我试过:

<meta name="apple-mobile-web-app-status-bar-style" content="default" />也 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

也用于:

<meta name="theme-color" content="#ffffff">

这些似乎都没有什么不同，我检查了标题颜色几乎与标题合并的其他网站，如果您检查:

cnn.com 或 hillarys.co.uk 您会看到标题会影响 iPad 上 Safari 导航栏的颜色，而在 iPhone 上它将接管缺口区域，因此它成为标题。对我来说，无论我做什么，我都无法让那个白色的标题/缺口与我的白色网站融为一体。

希望它有意义并提前致谢。

Answer 1

如果您的手机处于灯光外观模式(设置 -> 显示和亮度)，您似乎可以使用 <meta name="theme-color" content="foo"> 设置最大暗度。 .例如:

• <meta name="theme-color" content="blue">在浅色和深色模式下影响标题。
• <meta name="theme-color" content="black">在浅色和深色模式下影响标题。
• <meta name="theme-color" content="#ffffff">仅在浅色模式下影响标题。