codes - html background color transparent




Warum hält HTML „chucknorris“ für eine Farbe? (6)

Wie erzeugen bestimmte zufällige Zeichenfolgen Farben, wenn sie als Hintergrundfarben in HTML eingegeben werden? Zum Beispiel: 

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

... erstellt ein Dokument mit einem roten Hintergrund für alle Browser und Plattformen.

Interessanterweise produziert chucknorri einen roten Hintergrund, während chucknorri einen gelben Hintergrund erzeugt.

Was ist denn hier los?

Der Browser versucht, chucknorris in einen chucknorris Farbcode zu konvertieren, da dies kein gültiger Wert ist.

  1. In chucknorris ist alles außer c kein gültiger Hex-Wert.
  2. Es wird also in c00c00000000 konvertiert.
  3. Welches wird # c00000 , eine Rottöne .

Dies scheint vor allem bei Internet Explorer und Opera (12) ein Problem zu sein, da sowohl Chrome (31) als auch Firefox (26) dies einfach ignorieren.

PS Die Zahlen in Klammern sind die Browserversionen, die ich getestet habe.

.

Leichter

Chuck Norris entspricht nicht den Webstandards. Webstandards entsprechen ihm. # BADA55

Der Grund ist, dass der Browser es nicht verstehen kann und versuchen kann , es irgendwie in das zu verstehen, was er verstehen kann, und in diesem Fall in einen Hexadezimalwert! ...

chucknorris beginnt mit c , einem erkannten Zeichen im Hexadezimal- chucknorris , und konvertiert alle nicht erkannten Zeichen in 0 !

chucknorris im hexadezimalen Format wird also: c00c00000000 , alle anderen Zeichen werden 0 und c bleibt dort, wo sie sind ...

Jetzt werden sie für RGB (rot, grün, blau) durch 3 geteilt ... R: c00c, G: 0000, B:0000 ...

Wir wissen jedoch, dass das gültige Hexadezimal für RGB nur 2 Zeichen ist, R: c0, G: 00, B:00

Das eigentliche Ergebnis ist also: 

bgcolor="#c00000";

Ich habe auch die Schritte im Bild als Schnellreferenz hinzugefügt:

Die WHATWG-HTML-Spezifikation verfügt über den genauen Algorithmus zum Analysieren eines alten Farbwerts: https://html.spec.whatwg.org/multipage/infrastructure.html#rules-for-parsing-a-legacy-colour-value

Der Code, den Netscape Classic zum Analysieren von Farbstrings verwendet, ist Open Source: https://dxr.mozilla.org/classic/source/lib/layout/layimage.c#155

Beachten Sie beispielsweise, dass jedes Zeichen als Hexadezimalzeichen analysiert wird und dann in eine 32-Bit-Ganzzahl verschoben wird, ohne auf Überlauf zu prüfen . Nur acht Hex-Ziffern passen in eine 32-Bit-Ganzzahl, weshalb nur die letzten 8 Zeichen berücksichtigt werden. Nachdem die Hex-Ziffern in 32-Bit-Ganzzahlen analysiert wurden, werden sie in 8-Bit-Ganzzahlen gekürzt, indem sie durch 16 geteilt werden, bis sie in 8-Bit passen. Aus diesem Grund werden führende Nullen ignoriert.

Update: Dieser Code stimmt nicht genau mit den Angaben in der Spezifikation überein. Der einzige Unterschied besteht jedoch in einigen Codezeilen. Ich denke, es wurden diese Zeilen hinzugefügt (in Netscape 4): 

if (bytes_per_val > 4)
{
      bytes_per_val = 4;
}

Die meisten Browser ignorieren einfach alle Nicht-Hex-Werte in Ihrer Farbzeichenfolge und ersetzen Nicht-Hex-Ziffern durch Nullen.

ChuCknorris in c00c0000000 übersetzt. An diesem Punkt teilt der Browser die Zeichenfolge in drei gleiche Abschnitte auf, die die Werte Rot , Grün und Blau c00c 0000 0000 : c00c 0000 0000 . Zusätzliche Bits in jedem Abschnitt werden ignoriert, wodurch das Endergebnis #c00000 das eine rötliche Farbe hat.

Beachten Sie, dass dies nicht für die CSS-Farbanalyse gilt, die dem CSS-Standard entspricht. 

<p><font color='chucknorris'>Redish</font></p>
<p><font color='#c00000'>Same as above</font></p>
<p><span style="color: chucknorris">Black</span></p>

chucknorris ich nicht zustimmen, aber gemäß den Regeln für das Parsing eines von @Yuhong Bao geposteten Farbwerts chucknorris chucknorris NICHT #CC0000 , sondern eher #C00000 , einem sehr ähnlichen, jedoch etwas anderen Rotton. Ich habe das Firefox ColorZilla Add-On verwendet , um dies zu überprüfen.

Die Regeln besagen:

  • Machen Sie aus der Zeichenfolge eine Länge, die ein Vielfaches von 3 ist, indem Sie 0s hinzufügen: chucknorris0
  • Trennen Sie die Saite in 3 Saiten gleicher Länge: chuc knor ris0
  • kürzen Sie jede Zeichenfolge auf 2 Zeichen: ch kn ri
  • Behalten Sie die Hex-Werte bei, und fügen Sie bei Bedarf 0 hinzu: C0 00 00

Ich konnte diese Regeln verwenden, um die folgenden Zeichenfolgen richtig zu interpretieren:

  • LuckyCharms
  • Luck
  • LuckBeALady
  • LuckBeALadyTonight
  • GangnamStyle

UPDATE: Die ursprünglichen Antworter, die sagten, dass die Farbe #CC0000 haben ihre Antworten seitdem #CC0000 , um die Korrektur #CC0000 .

Antworten:

  • Der Browser versucht, chucknorris in einen Hexadezimalwert umzuwandeln.
  • Da c das einzige gültige Hex-Zeichen in chucknorris ist , ändert sich der Wert in: c00c00000000 ( 0 für alle ungültigen Werte ).
  • Der Browser teilt das Ergebnis in drei Gruppen auf: Red = c00c , Green = 0000 , Blue = 0000 .
  • Da gültige Hex-Werte für HTML-Hintergründe nur 2 Ziffern für jeden c00000 ( r , g , b ) enthalten, werden die letzten 2 Ziffern aus jeder Gruppe abgeschnitten, so dass ein rgb-Wert von c00000 übrig c00000 der eine ziegelrötlich getönte Farbe darstellt.





color   codes   code   html   background-color  


background-color