Почему HTML кажется "chucknorris" цветным?

Почему некоторые случайные строки генерируют цвета при вводе в качестве фоновых цветов в HTML? Например:

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

... создает документ с красным фоном во всех браузерах и платформах.

Интересно, что в то время как chucknorri создает красный фон, chucknorr создает желтый фон.

Что здесь происходит?

6098
задан user456584 30 нояб. '11 в 1:54
источник поделиться

7 ответов

Это отрыв от дней Netscape:

Отсутствующие цифры считаются 0 [...]. Неверная цифра просто интерпретируется как 0. Например, значения # F0F0F0, F0F0F0, F0F0F, #FxFxFx и FxFxFx одинаковы.

Это из сообщения в блоге . Немного расспросы по поводу разбора цвета Microsoft Internet Explorer, который охватывает его очень подробно, включая различную длину значений цвета и т.д.

Если мы применим правила в свою очередь из сообщения в блоге, мы получим следующее:

  1. Замените все несущие шестнадцатеричные символы на 0

    chucknorris becomes c00c0000000
    
  2. Выложите до следующего общего количества символов, делящихся на 3 (11 → 12)

    c00c 0000 0000
    
  3. Разделите на три равные группы, причем каждый компонент представляет соответствующий цветовой компонент цвета RGB:

    RGB (c00c, 0000, 0000)
    
  4. Усечение каждого из аргументов с точностью до двух символов

Это дает следующий результат:

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

Вот пример, демонстрирующий атрибут bgcolor в действии, чтобы произвести этот "удивительный" образец цвета:

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

Это также отвечает на другую часть вопроса; почему bgcolor="chucknorr" производит желтый цвет? Ну, если мы применяем правила, строка:

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

Это дает светло-желтого золота. Поскольку строка начинается с 9 символов, мы сохраняем второй C на этот раз, поэтому она заканчивается окончательным значением цвета.

Я изначально столкнулся с этим, когда кто-то указал, что вы можете сделать color="crap" и, ну, он выходит коричневым.

5628
ответ дан dash 01 дек. '11 в 0:53
источник поделиться

Сожалею, что не согласен, но согласно правилам для разбора устаревшего значения цвета, опубликованного @Yuhong Bao, chucknorris НЕ приравнивается к #CC0000, а скорее к #C00000, очень похожим, но слегка отличающимся оттенком красного. Я использовал надстройку Firefox ColorZilla, чтобы проверить это.

Правила гласят:

  • сделайте строку длиной, кратной 3, добавив 0s: chucknorris0
  • разделите строку на 3 строки равной длины: chuc knor ris0
  • обрезать каждую строку до двух символов: ch kn ri
  • сохранить шестнадцатеричные значения и при необходимости добавить 0: C0 00 00

Я смог использовать эти правила для правильной интерпретации следующих строк:

  • LuckyCharms
  • Luck
  • LuckBeALady
  • LuckBeALadyTonight
  • GangnamStyle

ОБНОВЛЕНИЕ: оригинальные ответчики, которые сказали, что цвет был #CC0000, с тех пор отредактировали свои ответы, включив исправление.

764
ответ дан Jeremy Goodell 17 окт. '12 в 20:55
источник поделиться

Большинство браузеров просто игнорируют любые NON-шестнадцатеричные значения в вашей цветовой строке, заменяя шестнадцатеричные цифры нулями.

ChuCknorris переводит на c00c0000000. В этот момент браузер разделит строку на три равные части, указав значения "красный", "зеленый" и "синий": c00c 0000 0000. Дополнительные биты в каждом разделе будут проигнорированы, что делает окончательный результат #c00000 красноватым.

Обратите внимание, что это не относится к синтаксическому разбору CSS, которые следуют стандарту 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>
312
ответ дан Mike Christensen 30 нояб. '11 в 2:01
источник поделиться

Браузер пытается преобразовать chucknorris в шестнадцатеричный цветовой код, потому что он не является допустимым значением.

  1. В chucknorris все, кроме c, не является допустимым шестнадцатеричным значением.
  2. Таким образом, он преобразуется в c00c00000000.
  3. Который становится # c00000, оттенком красного.

Это, похоже, проблема прежде всего с Internet Explorer и Opera (12), так как Chrome (31) и Firefox (26) просто игнорируют это.

PS Числа в скобках - это версии браузера, на которых я тестировал.

,

На более светлой ноте

Чак Норрис не соответствует веб-стандартам. Веб-стандарты соответствуют ему. # BADA55

185
ответ дан aWebDeveloper 30 нояб. '13 в 17:05
источник поделиться

Спецификация WHATWG HTML имеет точный алгоритм для анализа устаревшего значения цвета: https://html.spec.whatwg.org/multipage/infrastructure.html#rules-for-parsing-a-legacy-colour-value

Код Netscape Classic, используемый для синтаксического анализа цветных строк, является открытым исходным кодом: https://dxr.mozilla.org/classic/source/lib/layout/layimage.c#155

Например, обратите внимание, что каждый символ анализируется как шестнадцатеричная цифра, а затем смещается в 32-разрядное целое без проверки на переполнение. Только восемь шестнадцатеричных цифр вписываются в 32-битное целое число, поэтому учитываются только последние 8 символов. После разбора шестнадцатеричных цифр на 32-битные целые числа они затем усекаются в 8-разрядные целые числа, деля их на 16 до тех пор, пока они не поместится в 8-битные, поэтому ведущие нули игнорируются.

Обновление: этот код точно не соответствует тому, что определено в спецификации, но единственное отличие состоит в нескольких строках кода. Я думаю, что эти строки были добавлены (в Netscape 4):

if (bytes_per_val > 4)
{
 bytes_per_val = 4;
}
171
ответ дан Yuhong Bao 28 сент. '12 в 1:01
источник поделиться

Ответ:

  • Браузер попытается преобразовать chucknorris в шестнадцатеричное значение.
  • Поскольку c является единственным действительным шестнадцатеричным символом в chucknorris, значение превращается в: c00c00000000 (0 для всех недопустимых значений).
  • Затем браузер делит результат на 3 группы: Red = c00c, Green = 0000, Blue = 0000.
  • Поскольку действительные шестнадцатеричные значения для html-фонов содержат только 2 цифры для каждого типа цвета (r, g, b), последние две цифры усекаются из каждой группы, оставляя значение rgb c00000 которое является красно-красноватым тонированным цветом.

У легенды есть:

  • Чакноррис оставляет кроваво-красный фон, куда бы он ни пошел, включая веб-сайты.
148
ответ дан Webeng 24 мая '16 в 8:18
источник поделиться

Причина в том, что браузер не может его понять и попытаться каким-то образом перевести его на то, что он может понять, в данном случае в hexadecimal значение!

chucknorris начинается с c который является признанным символом в шестнадцатеричном виде, а также преобразует все непризнанные символы в 0 !

Поэтому chucknorris в шестнадцатеричном формате становится: c00c00000000, все остальные символы становятся 0 и c остается там, где они...

Теперь они делятся на 3 для RGB (красный, зеленый, синий)... R: c00c, G: 0000, B:0000...

Но мы знаем, что правильная hexadecimal для RGB - всего 2 символа, означает R: c0, G: 00, B:00

Таким образом, реальный результат:

bgcolor="#c00000";

Я также сделал шаги на изображении как быструю ссылку:

Почему HTML думает

71
ответ дан Alireza 01 июля '17 в 7:08
источник поделиться

Другие вопросы по меткам