本文翻译自：How to change the color of header bar and address bar in newest Chrome version on Lollipop?
Haven't found anything on this topic yet. 还没有找到关于这个主题的任何内容。 I really like the ability to change the color of address bar and header color on Overview? 我真的很喜欢在Overview上更改地址栏和标题颜色的颜色吗？ Is there any easy way to do this? 有没有简单的方法来做到这一点？
. 。
I think you need Android 5.0 Lollipop for this to work, and Chrome's Merge Tabs and Apps set to On . 我认为你需要Android 5.0 Lollipop才能工作，而Chrome的Merge标签和应用程序设置为On 。
#1楼
参考：https://stackoom.com/question/1p7i3/如何更改Lollipop上最新Chrome版本的标题栏和地址栏的颜色
#2楼
Found the solution after some searching. 经过一番搜索后找到解决方案。
You need to add a <meta> tag in your <head> containing name="theme-color" , with your HEX code as the content value. 您需要在包含name="theme-color" <head>中添加<meta>标记，并将HEX代码作为内容值。 For example: 例如：
<meta name="theme-color" content="#999999" />
#3楼
You actually need 3 meta tags to support Android, iPhone and Windows Phone 您实际上需要3个meta标记来支持Android，iPhone和Windows Phone
<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="#4285f4">
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#4285f4">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#4285f4">
#4楼
From the Official documentation , 从官方文档中 ，
For example, to set the background color to orange: 例如，要将背景颜色设置为橙色：
<meta name="theme-color" content="#db5945">
In addition, Chrome will show beautiful high-res favicons when they're provided. 此外，Chrome会在提供时显示出美丽的高分量优惠。 Chrome for Android picks the highest res icon that you provide, and we recommend providing a 192×192px PNG file. Chrome for Android会选择您提供的最高分辨率图标，我们建议您提供192×192px的PNG文件。 For example: 例如：
<link rel="icon" sizes="192x192" href="nice-highres.png">
#5楼
For example, to set the background to your favorite/Branding color 例如，将背景设置为您喜欢的/品牌颜色
Add Below Meta property to your HTML code in HEAD Section 将以下Meta属性添加到HEAD部分中的HTML代码
<head>
...
<meta name="theme-color" content="Your Hexadecimal Code">
...
</head>
Example 例
<head>
...
<meta name="theme-color" content="#444444">
...
</head>
In Below Image, I just mentioned How Chrome taken your theme-color Property 在下面的图片中，我刚才提到了Chrome如何采用您的主题颜色属性
Firefox OS, Safari, Internet Explorer and Opera Coast allow you to define colors for elements of the browser, and even the platform using meta tags. Firefox OS，Safari，Internet Explorer和Opera Coast允许您为浏览器的元素定义颜色，甚至使用元标记定义平台。
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="#4285f4">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
Safari specific styling Safari专用样式
From the guidelines Documents Here 从指南文件这里
Hiding Safari User Interface Components 隐藏Safari用户界面组件
Set the apple-mobile-web-app-capable meta tag to yes to turn on standalone mode. 将支持apple-mobile-web-app的元标记设置为yes以启用独立模式。 For example, the following HTML displays web content using standalone mode. 例如，以下HTML使用独立模式显示Web内容。
<meta name="apple-mobile-web-app-capable" content="yes">
Changing the Status Bar Appearance 更改状态栏外观
You can change the appearance of the default status bar to either black or black-translucent. 您可以将默认状态栏的外观更改为黑色或黑色半透明。 With black-translucent, the status bar floats on top of the full screen content, rather than pushing it down. 黑色半透明，状态栏浮动在全屏内容的顶部，而不是向下推。 This gives the layout more height, but obstructs the top. 这使布局更高，但阻碍了顶部。 Here's the code required: 这是所需的代码：
<meta name="apple-mobile-web-app-status-bar-style" content="black">
For more on status bar appearance, see apple-mobile-web-app-status-bar-style. 有关状态栏外观的更多信息， 请参阅apple-mobile-web-app-status-bar-style。
For Example: 例如：
Screenshot using black-translucent 使用黑色半透明的屏幕截图
Screenshot using black 截图使用黑色
4501
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
