« Voltar
em html web

O html pensa que "gabriel" é uma cor. Por quê?.

Fazendo uns testes hoje com Markdown fui inocentemente colar uma cor que eu queria pra um elemento html.
Só que no meu ctrl+v por alguma razão que eu não me lembro estava "gabriel" e não acor que eu queria:

O que aconteceu?

Mesmo "gabriel" não sendo uma cor, a letra ficou vermelha.
Achei estranho e troquei o texto:

Eita!
Mudou de novo.

Intrigado, fui pesquisar a respeito e encontrei essa questão no Stack Overflow. O restante desse post é baseado nas respostas que estão nesse link.

Quando o navegador encontra digitos para a cor que ele não entende ou que estão faltando, simplesmente os substitui por 0.
Por exemplo, os valores #F0F0F0, F0F0F0, F0F0F, #FxFxFx e FxFxFx são todos os mesmos.

No exemplo da pergunta no Stack Overflow, o cara usou "chucknorris" como cor.

O que o navegador faz é o seguinte:
1- Todos os caracteres hexadecimais não válidos são substituídos por por zeros. Ou seja, "chucknorris" vira:
c00c0000000

2- Verifica a quantidade de caracteres. É divisível por 3? Não, pois temos 11 caracteres. Então ele pega o próximo número divisível por 3(no caso, 12) e acrescenta um 0 para ficar com a 12 caracteres:
c00c 0000 0000

3- Quebra esses caracteres em 3 grupos com quantidades iguais, cada um representando a cor no sistema RGB:
RGB (c00c, 0000, 0000)

5-Trunca cada um dos valores para dois caracteres somente, retirando os da direita:
RGB (c0, 00, 00)

Que é o equivalente à:
#C00000

Ou:
RGB(192, 0, 0)

Que é um tom de vermelho.
E ele faz a mesma coisa com qualquer texto que você colocar, resultando em várias cores diferentes.

Aparentemente, isso é um resquício da época do Netscape. O código que ele usava pra renderizar cores é open source.

Interessante, né?
Vivendo e aprendendo (:


Quer ganhar 15% de desconto pra gastar na Casa do Código e ainda ficar em dia com as minhas postagem e outras promoções e sorteios legais? Assina minha newsletter: http://gabsferreira.com/newsletter/ (:

Se quiser, curta minha página no Face também! O endereço é https://www.facebook.com/devgabsferreira

comments powered by Disqus