Curiosidades del HTML ¿Por qué Chuck Norris es un color?

¿Sabías que Chuck Norris es un color? Sí, me refiero a que por alguna razón cuando escribes el nombre del famoso actor y experto en artes marciales como valor etiqueta HTML para definir el color de fondo pues resulta en un color rojo intenso.

Esto tiene su explicación, no es que alguien quisiera hacerle un homenaje, ya podrían hacerle un homenaje a Pat Morita ,digo. pero no, la razón es mucho más casual.

 <body bgcolor="chucknorris">test</body>

Cuando definimos un color en HTML podemos hacerlo de varias formas, por ejemplo utilizando un código de color en hexadecimal o mediante una cadena de caracteres, cuando se hace esto último se produce una traducción. Ahora bien si usamos caracteres inválidos en un código de color que está escrito en notación hexadecimal, estos caracteres son tratadas como 0. Un número hexadecimal puede contener las caracteres [0-9a-f], cualquier otro carácter encontrado es reemplazado con 0.

Para chucknorris:

  • Reemplazar caracteres inválidos:
    chucknorris → c00c0000000
  • Rellenar con 0 hasta que el número de caracteres es divisible por 3:
    c00c0000000 (11) → c00c 0000 0000 (12)
  • Formatear en notación RGB:
    rgb(c00c, 0000, 0000)
  • Truncar cada valor a dos caracteres:
    rgb(c0, 00, 00)
  • Traducir de hexadecimal a decimal:
    rgb(192, 0, 0) [ == #C00000]

Y así el color resultante es rojo.

Esta curiosidad podemos verlo con otros ejemplos como por ejemplo crapninjaturtlesickgrass.

<table>
<tr>
<td bgcolor="chucknorris" cellpadding="8" width="100" align="center">chuck norris</td>
<td bgcolor="mrt" cellpadding="8" width="100" align="center" style="color:#ffffff">Mr T</td>
<td bgcolor="ninjaturtle" cellpadding="8" width="100" align="center" style="color:#ffffff">ninjaturtle</td>
</tr>
<tr>
<td bgcolor="sick" cellpadding="8" width="100" align="center">sick</td>
<td bgcolor="crap" cellpadding="8" width="100" align="center">crap</td>
<td bgcolor="grass" cellpadding="8" width="100" align="center">grass</td>
</tr>
</table>
Comparte esta entrada: