Pourquoi HTML pense que "chucknorris" est une couleur?

comment se fait-il que certaines chaînes aléatoires produisent des couleurs lorsqu'elles sont entrées en tant que couleurs d'arrière-plan en HTML? Par exemple:

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

...produit un document avec un fond rouge sur tous les navigateurs et plateformes.

fait intéressant, alors que chucknorri produit aussi un fond rouge, chucknorr produit un fond jaune.

What's going on ici ?

6647
demandé sur Gibin Ealias 2011-11-30 02:54:22
la source

8 ответов

C'est un vestige de Netscape jours:

les chiffres manquants sont traités comme 0[...]. Un chiffre incorrect est simplement interprété comme 0. Par exemple, les valeurs #F0F0F0, F0F0F0, F0F0F, #fxfxfx et FxFxFx sont toutes les mêmes.

il est de l'article de blog un peu rant au sujet de Microsoft Internet Explorer parsing couleur qui couvre en grand détail, y compris variation de la longueur des valeurs de couleur, etc.

si nous appliquons les règles à tour de rôle à partir de l'article de blog, nous obtenons ce qui suit:

  1. remplacer tous les caractères hexadécimaux nonvalides par les lettres 0

    chucknorris becomes c00c0000000
    
  2. Pad à la prochaine nombre total de caractères divisible par 3 (11 -> 12)

    c00c 0000 0000
    
  3. divisé en trois groupes égaux, avec chaque composant représentant le composant de couleur correspondant d'une couleur RVB:

    RGB (c00c, 0000, 0000)
    
  4. Tronquer chacun des arguments de la droite à deux caractères

qui donne le résultat suivant:

RGB (c0, 00, 00) = #C00000 or RGB(192, 0, 0)

voici un exemple démontrant l'attribut bgcolor en action, pour produire ce" étonnant "swatch de couleur:

<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>

cela répond aussi à l'autre partie de la question: pourquoi bgcolor="chucknorr" produit-il une couleur jaune? Si on applique les règles, la chaîne est:

c00c00000 => c00 c00 000 => c0 c0 00 [RGB(192, 192, 0)]

qui donne une couleur or jaune clair. Comme la chaîne commence en 9 caractères, Nous gardons le deuxième C cette fois-ci et il finit dans la valeur finale de la couleur.

j'ai d'abord rencontré cela quand quelqu'un a souligné que vous pourriez faire color="crap" et, bien, il sort brun.

6143
répondu dash 2016-01-31 15:08:56
la source

je suis désolé de ne pas être d'accord, mais selon les règles pour l'analyse d'une valeur de couleur d'héritage posté par @Yuhong Bao , chucknorris ne correspond pas à #CC0000 , mais plutôt à #C00000 , une teinte de rouge très similaire mais légèrement différente. J'ai utilisé le Firefox ColorZilla add-on pour vérifier cela.

Les règles de l'état:

  • faire de la chaîne une longueur qui est un multiple de 3 en ajoutant 0s: chucknorris0
  • séparer la chaîne en 3 chaînes de longueur égale: chuc knor ris0
  • tronquer chaque chaîne de caractères à 2 caractères: ch kn ri
  • conserver les valeurs hex, et Ajouter 0's si nécessaire: C0 00 00

j'ai pu utiliser ces règles pour interpréter correctement les chaînes suivantes:

  • LuckyCharms
  • Luck
  • LuckBeALady
  • LuckBeALadyTonight
  • GangnamStyle

mise à jour: les premiers répondants qui ont dit que la couleur était #CC0000 ont depuis modifié leurs réponses pour inclure la correction.

846
répondu Jeremy Goodell 2017-10-05 20:10:38
la source

la plupart des navigateurs ignoreront simplement les valeurs NON-hex de votre chaîne de couleurs, en remplaçant les chiffres non-hex par des zéros.

ChuCknorris se traduit par c00c0000000 . À ce moment, le navigateur divisera la chaîne en trois sections égales, indiquant Rouge , Vert et Bleu valeurs: c00c 0000 0000 . Les bits supplémentaires dans chaque section seront ignorés, ce qui rend le résultat final #c00000 qui est d'une couleur rougeâtre.

Nota: et non s'appliquent à l'analyse des couleurs CSS, qui suit la norme CSS.

<p><font color='chucknorris'>Redish</font></p>
<p><font color='#c00000'>Same as above</font></p>
<p><span style="color: chucknorris">Black</span></p>
343
répondu Mike Christensen 2014-09-17 20:09:13
la source

le navigateur essaie de convertir chucknorris en code couleur hexadécimal, parce que ce n'est pas une valeur valide.

  1. Dans chucknorris , tout sauf c n'est pas une valeur hexadécimale.
  2. donc il est converti en c00c00000000 .
  3. qui devient #c00000 , une nuance de rouge.

cela semble être un problème principalement avec Internet Explorer et Opera (12) comme Chrome (31) et Firefox (26) juste ignorer cela.

P. Les numéros entre parenthèses sont les versions de navigateur que j'ai testées.

.

sur une note plus légère

Chuck Norris n'est pas conforme aux standards du web. Conformité aux normes Web pour lui. # BADA55

231
répondu aWebDeveloper 2018-06-11 09:08:02
la source

le WHATWG HTML spec a l'algorithme exact pour analyser une valeur de couleur héritée: https://html.spec.whatwg.org/multipage/infrastructure.html#rules-for-parsing-a-legacy-colour-value

le code Netscape Classic utilisé pour analyser les chaînes de couleurs est open source: https://dxr.mozilla.org/classic/source/lib/layout/layimage.c#155

par exemple, notez que chaque caractère est divisé en hexagones chiffre et est ensuite décalé dans un entier de 32 bits sans vérification de débordement . Seulement huit chiffres hexadécimaux s'inscrivent dans un entier de 32 bits, c'est pourquoi seuls les 8 derniers caractères sont considérés. Après avoir divisé les nombres hexadécimaux en nombres entiers de 32 bits, ils sont alors tronqués en nombres entiers de 8 bits en les divisant par 16 jusqu'à ce qu'ils s'adaptent en 8 bits, ce qui explique pourquoi les zéros principaux sont ignorés.

mise à Jour: ce code ne correspond pas exactement à ce qui est défini dans la spécification, mais la seule différence qu'il y est quelques lignes de code. Je pense que ce sont ces lignes qui ont été ajoutées (dans Netscape 4):

if (bytes_per_val > 4)
{
      bytes_per_val = 4;
}
192
répondu Yuhong Bao 2017-01-26 21:45:01
la source

réponse:

  • le navigateur tentera de convertir chucknorris en une valeur hexadécimale.
  • puisque c est le seul caractère hexadécimal valide dans chucknorris , la valeur se transforme en: c00c00000000 ( 0 pour toutes les valeurs qui étaient invalides ).
  • le navigateur divise ensuite le résultat en 3 groupes: Red = c00c , Green = 0000 , Blue = 0000 .
  • étant donné que les valeurs hex valides pour les fonds html ne contiennent que 2 chiffres pour chaque type de couleur ( r , g , b ), les 2 derniers chiffres sont tronqués de chaque groupe, laissant une valeur rgb de c00000 qui est une couleur rouge brique.
173
répondu Webeng 2018-06-08 09:20:05
la source

la raison est le navigateur peut ne pas comprendre il et essayer de traduire d'une certaine façon à ce qu'il peut comprendre et dans ce cas en une valeur hexadécimale!

chucknorris commence par c qui est un caractère reconnu dans hexadécimal, il convertit aussi tous les caractères non reconnus en 0 !

ainsi chucknorris en format hexadécimal devient: c00c00000000 , tous les autres caractères deviennent 0 et c reste à l'endroit où ils sont...

Maintenant, ils sont divisés par 3 pour RGB (rouge, vert, bleu)... R: c00c, G: 0000, B:0000 ...

mais nous savons valide hexadécimal pour RGB est juste 2 caractères, signifie R: c0, G: 00, B:00

donc le résultat réel est:

bgcolor="#c00000";

j'ai également ajouté les étapes dans l'image comme une référence rapide:

Why does HTML think “chucknorris” is a color?

148
répondu Alireza 2018-07-12 16:09:29
la source

chucknorris est stats avec c le navigateur de lire une valeur hexadécimale.

parce que a, b, c, D,e, F sont caractères hexadécimaux

Le navigateur chucknorris convertir c00c00000000 valeur hexadécimale.

puis c00c00000000 valeur hexadécimale convertie en RGB format (divisé par 3)

c00c00000000 => R:c00c,G:0000,B:0000

le navigateur n'a besoin que de deux chiffres pour indiquer la couleur.

R:c00c,G:0000,B:0000 => R:c0,G:00,B:00 => c00000

enfin, afficher bgcolor = c00000 dans le navigateur web.

voici un exemple démontrant

<table>
  <tr>
    <td bgcolor="chucknorris" cellpadding="10" width="150" align="center">chucknorris</td>
    <td bgcolor="c00c00000000" cellpadding="10" width="150" align="center">c00c00000000</td>
    <td bgcolor="c00000" cellpadding="10" width="150" align="center">c00000</td>
  </tr>
</table>
7
répondu sameera lakshitha 2018-04-17 22:16:30
la source

Autres questions sur html background-color