iOS 15 Safari CSS

Question

我安装了 iOS 15 测试版并在新的 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

如果您的手机处于 Light Appearance 模式（设置 -> 显示和亮度），您似乎可以使用 <meta name="theme-color" content="foo"> 设置最大暗度。例如：

• <meta name="theme-color" content="blue"> 影响明暗模式下的标头。
• <meta name="theme-color" content="black"> 影响明暗模式下的标头。
• <meta name="theme-color" content="#ffffff"> 仅在轻量模式下影响标头。