Використовуємо будь-який рядок як колір в HTML

05 вересня 2014 21:34 comandante 257 0

 

Чи знаєте ви, що будь-який рядок може бути використаний в якості коду кольору для HTML? Наприклад:

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

У наведеному вище прикладі браузер приймає "chucknorris" як колір rgb(192, 0, 0) і застосовує його для тега body.

Давайте спробуємо використати інші імена.

<body bgcolor="obama">
</body>	

"Obama" прирівнюється до rgb(11, 160, 160).

Аналогічно:

"Syed" прирівнюється до rgb(0, 237, 0).
"Disney" прирівнюється до rgb(208, 0, 224)
"Microsoft" те ж саме, що й rgb(12, 0, 240).


Виходить, що nonCSS властивості приймають будь-який рядок як код кольору. Це дісталося нам з ери netscape, яка продовжується в сучасних браузерах.

 

Як це працює:

  1. Браузер намагається інтерпретувати ці слова у вигляді hex-кодів.
  2. Слово "chucknorris" має 11 літер. Воно змінює число символів на 12, кратне 3. Додатковий " 0" додається в кінець, щоб отримати слово "chucknorris0".
  3. Це слово тепер ділиться на 3 категорії: червоний, зелений і блакитний. Отже, ми отримуємо "chucknorris0" = "chuc" + "knor" + "ris0".
  4. Тільки перші 2 символи з кожної категорії беруться, щоб отримати 6-значний ШІСТНАДЦЯТКОВИЙ код. Отже, ми отримуємо колірний код "CHKNRI".
  5. Так як в HEX-кодах дозволяються тільки літери від A до F, додаткові символи в "CHKNRI" перетворюються в '0'. Ми, нарешті, отримати HEX код "C00000".
  6. Якщо ви виконайте перетворення HEX в RGB, ви знайдете, що "C00000" прирівнюється до rgb(192, 0, 0).

Це стосується всіх зазначених вище імен. Спробувати вирішити їх самостійно, і порівняти з RGB кольорами.

 

Немає сенсу використовувати рядок як код кольору. Це безумовно зробить ваш CSS більш складним і важким для розуміння.

257 6

Схожі матеріали:

Коментарі:

Авторизуйтесь, щоб залишити коментар.