Изменение цвета статус бара для мобильных устройств.


Если ваш сайт выполнен в определенном цвете то хотелось бы что он гармонично смотрелся на экране и мобильного устройства и если вы используете адаптивную версию то можно поменять цвет статус бара в цвет вашего сайта.

И так начнем.

Для того что бы изменить цвет статус бара в браузерах Chrome, Opera и Firefox используем мета тег:

<meta name="theme-color" content="#5b72c7">

Для Windows Phone используем тег:

<meta name="msapplication-navbutton-color" content="#5b72c7">

А вот для с браузером Safari на IOS устройствах все печальнее так как имеет всего несколько вариантов.

Тег для Safari:

<meta name="apple-mobile-web-app-status-bar-style" content="black">

Варианты «content»:

content="black"
content="default"
content="black-translucent"

За счет этих мета тегов размещенных в HEAD можно сделать интерфейс адаптивной версии на мобильных устройствах чуточку дружелюбнее.

#html

Copyright © 2013-2017