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="#ecd96f">

Ничего из этого, похоже, не имеет значения, я проверил другие веб-сайты, где цвет заголовка в значительной степени сливается с заголовком, если вы проверите:

cnn.com или hillarys.co.uk вы увидите , что заголовок влияет на цвет панели навигации в Safari на IPAD, 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"> влияет на заголовок только в облегченном режиме.