Category: HTML5

How do you disable viewport zooming on Mobile?

HTML Meta tag inside write user-scalable=no like below:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
Advertisements

How to change the status bar color using meta tag

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”>

How to change mobile theme color using meta tag

This below code write under your <head> tags.

<!– 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-capable” content=”yes”>
<meta name=”apple-mobile-web-app-status-bar-style” content=”black-translucent”>