Android 手機版的 Chrome 瀏覽器可以透過網頁設定工具列的顏色,讓手機的畫面與網頁的佈景主題一致,看起來更美觀。

一般手機瀏覽器的工作列顏色都是固定的,而現在 Android 手機版的 Chrome 瀏覽器從第 39 版之後,開始支援從網頁中指定佈景主題顏色的功能,這個簡單的小功能可以讓網站看起來更專業,也更漂亮,以下是設定的方法教學。


如果用手機瀏覽一般的網頁,畫面會像這樣,不管觀看哪一個網站,瀏覽器上方的工作列始終都是灰色的。

android-chrome-browser-theme-color-support-2

手機瀏覽網頁

現在我們可以藉由新的佈景主題顏色功能,在網頁中指定 Chrome 瀏覽器工作列的背景顏色,設定的方法很簡單,只要在網頁的 <head> 中加入一行:

<meta name="theme-color" content="#db5945">

其中 content 的值就填入想要指定的顏色,這樣手機版的 Chrome 瀏覽器就會自動將工具列的背景改成這個顏色,以下是兩個使用 theme-color 網站看起來的效果。

android-chrome-browser-theme-color-support-1

手機版 Chrome 瀏覽器指定工具列顏色

跟網頁的主題顏色搭配之後,會讓人感覺更美觀,也更專業。

參考資料:Google DevelopersARJUN U.