apple-mobile-web-app-status-bar-style做什么?

什么

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

做 – 可以有人解释一个例子吗?

我在官方的Safari Developer Library中find了这一行

除非您首先指定“url”中所述的全屏模式,否则此元标记无效。

但是,哪个url?

这个元标签有什么好处?

首先, apple-mobile-web-app-capable提示必须设置为甚至工作。 这个提示会导致Web应用程序以全屏模式运行:它将移除Mobile Safari中默认获取的地址栏和导航button。 删除的区域在这里以红色突出显示:

苹果手机网页应用程序能力

所以,一旦应用程序处于全屏模式(即用户已经将网站添加到他们的主页),您还可以使用apple-mobile-web-app-status-bar-style control来控制页面顶部剩余的瘦状态栏的颜色。 apple-mobile-web-app-status-bar-style ,在这里用红色突出显示:

苹果手机网站应用状态栏的风格

根据文档:

如果内容设置为default ,状态栏显示正常。 如果设置为black ,状态栏的背景为黑色。 如果设置为black-translucent状态栏是黑色半透明的。 如果设置为默认或黑色,Web内容显示在状态栏下方。 如果设置为black-translucent ,Web内容将显示在整个屏幕上,部分被状态栏遮挡。

几个注意事项:

  1. 这只适用于您加载的第一页; 任何导航到另一个页面将使地址栏和导航button重新出现。 所以如果你想这个工作,你必须build立一个单一的网页(多个“网页”考虑一个Ajax页面加载的方法,如在jQuery Mobile框架中使用的)。

  2. 这只有当您通过应用程序快捷方式图标到达网页时才有效; 如果您从Mobile Safari内直接导航到网站,则不起作用。

它改变顶部酒吧瓦特/旗帜和载体,并使其成为半透明的黑色。