Как HTML определяет, какой цвет задает строка? Например, цвет этой страницы:
<body bgcolor="chucknorris">Типичный программист</body>будет красным для всех платформ и браузеров. Проверить можно здесь, на Fiddle. Забавно, что и chucknorri обозначает красный цвет, а вот chucknorr уже задает желтый.
Почему это происходит?
Это пережиток еще тех дней, когда самым популярным браузером был Netscape. Все пропущенные и некорректные разряды в строке, задающей, цвет, заменяются на 0. Так, #F0F0F0, F0F0F0, F0F0F, #FxFxFx и FxFxFx – это все один и тот же цвет.
Вот здесь можно найти описание этой схемы со всеми подробностями. Согласно описанному в этой статье, Чак пройдет следующую череду преобразований:
| Что происходит вообще | Что происходит с Чаком (chucknorris) |
|---|---|
| Все некорректные 16-ричные символы будут заменены нулями | c00c0000000 |
| Теперь сделаем длину этой строки кратной трем, дописав справа нули | c00c 0000 0000 |
| Разделим на три равные группы, каждая из которых будет задавать один из цветов RGB | RGB (c00c, 0000, 0000) |
| Теперь каждое из чисел уменьшим до длины в два разряда | RGB (c0, 00, 00) = #C00000 или RGB(192, 0, 0) |
Вот здесь представлены другие цвета, заданные нехитрыми словами.
Теперь аналогично посмотрим, почему chucknorr представляет собой желтый цвет. Цепочка будет иметь следующий вид: chucknorr → c00c00000 → c00 c00 000 → RGB(c0,c0,00) – это смесь темного красного и темного зеленого, т.е. золотой цвет. Т.е. здесь второй символ с не пропадает, т.к. изначальная длина строки кратна трем и он попадает в начало RGB-разряда.
Однако, если длина отдельного значения цвета RGB превышает 8, то преобразование происходит иначе: сначала длина уменьшается до восьми отбрасыванием символов слева, а потом уменьшается до двух отбрасыванием символов справа. Неожиданно, не правда ли?
Как указано в статье, все это происходит именно так в Internet Explorer. Но предполагается, что и в других браузерах происходит аналогично. В общем-то, такая ситуация вполне себе ожидаема, если понимать, что HTML выполняет все, что ему скажут, правда, если сказано неверно, то по-своему.
P.S. tproger соответствует черному цвету, а вот tproger.ru – темно-зеленому.
Источники: stackoverflow.com, habrahabr.ru.
Ещё интересное для вас:
— Тест «Насколько хорошо вы разбираетесь в C#?»
— Блиц-тест «Настоящий ли ты фронтендер?»
— Меньше готовить, больше кодить: обзор питания с доставкой на дом.
