¿Cómo es posible que algunas cadenas de texto produzcan valores correctos para los colores de los elementos HTML? Si utilizo por ejemplo el siguiente código:
<body bgcolor="chucknorris"> prueba </body>
La página se muestra en todos los navegadores con un color de fondo rojo. Algunas variantes de este valor producen otros colores: chucknorri
también muestra un color rojo, pero chucknorr
muestra un color amarillo.
¿Alguien sabe por qué sucede esto?
Estás leyendo una traducción autorizada de la pregunta Why does HTML think “chucknorris” is a color? planteada por user456584 en StackOverflow.
Respuestas
Aunque este comportamiento ha durado hasta nuestros días, su origen se encuentra en un navegador llamado Netscape y que se usaba en los primeros años de la web. En concreto:
[En Netscape] Cuando al valor de un color le faltan dígitos o alguno de ellos es incorrecto, se sustituyen por el valor
0
. Así que los valores#F0F0F0
,F0F0F0
,F0F0F
,#FxFxFx
yFxFxFx
son todos equivalentes.
Te aconsejo que eches un vistazo a este artículo que explica con todo detalle este comportamiento. Pero en resumen, estos serían los cálculos:
1. Reemplazar cualquier carácter inválido con un 0
chucknorris se transforma en c00c0000000
2. Rellenar con ceros hasta conseguir un número de dígitos/caracteres divisible por 3
. Como tenemos 11 caracteres, se añade un 0
por el final:
c00c 0000 0000
3. Dividir el resultado en tres grupos iguales, cada uno de ellos representando una de las componentes de los colores RGB:
RGB (c00c, 0000, 0000)
4. Truncar el valor de cada componente a dos caracteres empezando por la izquierda:
RGB (c0, 00, 00) = #C00000 = RGB(192, 0, 0)
Aplicando el mismo razonamiento, puedes definir colores utilizando cualquier otra cadena de texto. Por ejemplo la cadena grass
(hierba en inglés) se muestra de color verde.
Con respecto a por qué la cadena chucknorr
produce un color amarillo, si haces el cálculo verás que:
c00c00000 => c00 c00 000 => c0 c0 00 [RGB(192, 192, 0)]
@librosweb