Personalize a barra de endereço do seu site com theme-color do HTML5

Personalize a barra de endereço do seu site com theme-color do HTML5

Por Maicon Ramos

11/05/2017
Personalize a barra de endereço do seu site com theme-color do HTML5

Personalize a barra de endereço do seu site com theme-color do HTML5

Dicas

[et_pb_post_title_2 admin_label=”Autor do Post” title=”off” date_format=”d/m/Y” categories=”off” comments=”off” featured_image=”off” title_font_size_tablet=”51″ title_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ _i=”0″ _address=”2.0.0.0″ /]
A partir da atualização do Chrome para a versão 39 no Android Lollipop, já é possível utilizar uma tag de personalização para a barra de ferramenta, navegação, endereço, header, toolbar ou como preferir chamar, a implementação é bastante simples, apenas utilizando uma meta tag dentro do <head> com o atributo name=”theme-color” e definir uma cor em hexadecimal, RGB ou pelo nome como utilizado no CSS.


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

Exemplo

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="theme-color" content="#0000ff">
  <title>theme-color</title>
</head>
<body>
</body>
</html>
Personalize a barra de navegação do seu site com theme-color do HTML5
Lembrando que esse recurso por enquanto é exclusivo para navegadores Chrome e Opera utilizando o sistema operacional Android.

 

theme-color de maiconramos.com
[et_pb_post_title_2 admin_label=”Data e categoria” title=”off” author=”off” date_format=”d/m/Y” comments=”off” featured_image=”off” text_orientation=”center” title_font=”|on|||” title_font_size_tablet=”51″ title_line_height_tablet=”2″ meta_font=”|on|||” meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ custom_css_main_element=”text-transform: uppercase;||font-weight: 800;” _i=”1″ _address=”4.0.0.1″ /]

Comentários