Altere a cor do texto selecionado do seu site

Já reparou que ao selecionar o texto em algum site, ele não está naquele azul tradicional? Trata-se de uma declaração do CSS3: o ::selection. Ela sobrescreve a cor padrão do seu navegador ou sistema. Infelizmente, este recurso funciona apenas em alguns navegadores, como o Chrome, Firefox, Safari em suas versões mais recentes.

Altere a cor do texto selecionado do seu site 1


Faça o teste e selecione algum texto do netmundo, ele deve aparecer com a cor verde. Então vamos ao código:

{code type=css}
::selection {
background: #ffb7b7; /* Safari */
color:#000000;
}
::-moz-selection {
background: #ffb7b7; /* Firefox */
color:#000000;
}

Se não quiser alterar a cor do texto durante a seleção basta remover a linha “color:…”. Se quiser aplicar cores diferentes ao longo da página, basta aplicar classes:

{code type=css}
div.conteudo::selection {
background: #ffb7b7; /* Safari */
color:#000000;
}
div.conteudo::-moz-selection {
background: #ffb7b7; /* Firefox */
color:#000000;
}

Pronto. Seu site está personalizado!

Deixe um comentário