ios apple-mobile-web-app-status-bar-style 有什么作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6582732/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What does apple-mobile-web-app-status-bar-style do?
提问by Jitendra Vyas
What does
有什么作用
<meta name="apple-mobile-web-app-status-bar-style" content="black">
do -- can someone explain with an example?
做 - 有人可以用一个例子来解释吗？
I found this linein the official Safari Developer Library
我在官方的 Safari 开发者库中找到了这一行
This meta tag has no effect unless you first specify full-screen mode as described in “url.”
除非您首先按照“url”中的说明指定全屏模式，否则此元标记无效。
But which url?
但是哪个网址？
What is the benefit of this meta tag?
这个元标记有什么好处？
回答by Ben
First, the apple-mobile-web-app-capablehint has to be set for that to even work. This hint causes a web application to run in full-screen mode: it removes the address bar and navigation buttons you get by default in Mobile Safari. The removed areas are highlighted in red here:
首先，apple-mobile-web-app-capable必须设置提示才能使其工作。此提示会导致 Web 应用程序以全屏模式运行：它会删除您在 Mobile Safari 中默认获得的地址栏和导航按钮。删除的区域在此处以红色突出显示：
So, once an app is in full-screen mode (i.e. the user has added the website to their home page), you can also control the colour of the remaining thin status bar at the top of the page with apple-mobile-web-app-status-bar-style, highlighted in red here:
因此，一旦应用程序处于全屏模式（即用户已将网站添加到其主页），您还可以控制页面顶部剩余的细状态栏的颜色apple-mobile-web-app-status-bar-style，在此处以红色突出显示：
Per the docs:
根据文档：
If content is set to
default, the status bar appears normal. If set toblack, the status bar has a black background. If set toblack-translucent, the status bar is black and translucent. If set to default or black, the web content is displayed below the status bar. If set toblack-translucent, the web content is displayed on the entire screen, partially obscured by the status bar.
如果 content 设置为
default，状态栏显示正常。如果设置为black，状态栏有黑色背景。如果设置为black-translucent，状态栏为黑色半透明。如果设置为默认或黑色，则 Web 内容显示在状态栏下方。如果设置为black-translucent，Web 内容将显示在整个屏幕上，部分被状态栏遮挡。
A couple of caveats:
几个警告：
This only works on the firstpage you load; any navigation away to another page will make the address bar and navigation buttons reappear. So if you want this to work, you have to build a single page website (for multiple 'pages' consider an Ajax page loading approach such as that used in the jQuery Mobile framework).
This only works when you arrive at the web page via an application shortcut icon;if you navigate to the website directly from within Mobile Safari it has no effect.
这仅适用于您加载的第一页；任何导航到另一个页面都会使地址栏和导航按钮重新出现。因此，如果您想让它工作，您必须构建一个单页面网站（对于多个“页面”，请考虑使用 Ajax 页面加载方法，例如 jQuery Mobile 框架中使用的方法）。
这仅在您通过应用程序快捷方式图标到达网页时有效；如果您直接从 Mobile Safari 中导航到该网站，则它不起作用。
回答by Anonymous
It changes the top bar w/ the banner and carrier on it and makes it a translucent black.
它改变了带有横幅和载体的顶部栏，使其成为半透明的黑色。
