iOS7 safari mobile minimal navigation bar

在手機上畫面基本上已經不大,又被討厭的網址列、上一頁、下一頁 等按鈕佔去了上方與下方一部分真的很礙眼,還好 iOS7 有解決了這件事,就是在 head 內的 viewport 加上 minimal-ui,如同下方的方式:

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />

加入 minimal-ui 前,上方的網址列以及下方的按鈕列都存在


加入 minimal-ui 後,上方的網址列以及下方的按鈕列消失,旨剩下 page title


點擊上方的 page title 後網址列、按鈕列才會出現,中間那塊加上灰色遮照來做區隔