Web设置网页在 Safari 浏览器顶部状态栏的颜色

苹果最近发布了 IOS 15，这个版本里 Safari 浏览器有了很大的变化，首先把地址栏移到底部，方便切换不同的标签页和输入网址，特别是对于大屏手机来说，可能一开始使用的时候会有点习惯问题，习惯性往上输入网址，习惯了之后，会特别方便。

Safari 15 支持顶部状态栏颜色

另外还有一个特别大的改进是支持web设置顶部状态栏的颜色了：

在最新的 Safari 版本中顶部状态栏的颜色这个功能是通过使用的 theme-color 这个 meta 标签来实现的。

只要你在你的网页的头部加入下面这行代码即可：

<meta name="theme-color" content="#0a1992">

如果你的网页支持暗黑模式，希望两种模式设置的顶部状态的颜色不同，可以加入一下两行代码：

<meta name="theme-color" content="#1972F8" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#1C4D98" media="(prefers-color-scheme: dark)">

写在最后：

以前的Safari版本也是支持修改状态栏颜色的，只不过限制三种风格：黑、白、半透明，在最新的版本中可以自定义任何颜色了快去试试吧！

另外PC版的 Safari 浏览器也是支持这个功能，前提是 Mac 系统的 Safari 浏览器也要升级到最新版！