Найти тему

Цвет текста HTML

Раньше было всё просто. У тега <font> был атрибут color, который и задавал цвет текста. У некоторых других тегов были похожие атрибуты, например, bgcolor, который определял цвет фона.

Однако с некоторых пор тег <font> попал в список нежелательных. Он поддерживается всеми современными браузерами, и его можно использовать. Но всё-таки это нежелательно, раз уж он попал в этот список. Поэтому сегодня обычно для задания цвета используют стили.

Изначально для задания цвета использовалась цветовая модель RGB. Она и сегодня может использоваться (и используется в большинстве случаев, во всяком случае выглядит это именно так).

Однако в какой-то момент возможностей этой модели стало не хватать. Поэтому появилась модель sRGB, которая лишена основного недостатка модели RGB.

А основным недостатком является то, что цвета, полученные с помощью RGB могут существенно отличаться на разных мониторах. Поэтому вы и можете до сих пор встретить на просторах Интернета так называемые таблицы безопасных цветов, с помощью которых можно определить, какой цвет будет правильно (безопасно - без опасности искажения) отображаться на всех мониторах.

В отличие от атрибутов в тегах, таких как <font>, тип color в CSS представляет цвет именно в спектре sRGB. Поэтому сегодня, конечно, для задания цвета лучше использовать стили. Хотя фиг его знает, может современные браузеры любые цвета отображают как sRGB, даже если они заданы с помощью устаревших тегов (я этого точно не знаю).

Например, чтобы задать цвет фона в ячейке таблицы “дедовским” способом, можно сделать так:

<td bgcolor="#FFFF00"></td>

Эта ячейка будет жёлтого цвета. То же самое можно сделать с помощью CSS:

<td style="background-color: #FFFF00;"></td>

Кроме того, вы можете ещё добавить значение прозрачности. Таким образом полная запись цвета в RGB-модели будет:

R, G, B, A

Где R - красный цвет, G - зелёный цвет, B - синий цвет, А - прозрачность (необязательная часть). И вот этот пример:

<td style="background-color: #FFFF0050;"></td>

Сделает ячейку таблицы также жёлтой, но полупрозрачной. Точнее, не “полу” в нашем случае, а значительно более прозрачной, чем наполовину. А вообще прозрачность задаётся значением от 0 до 255, где 0 - полностью непрозрачная, 255 - полностью прозрачная. Выглядеть всё это безобразие будет так:

Кстати, прозрачность можно добавить и в случае задания цвета с помощью средств HTML. И, как видите, это не то же самое, что в случае с CSS. Из этого можно сделать вывод, что всё-таки в устаревшем способе это будет работать неправильно. Скорее всего, это будет восприниматься не как прозрачность. Но знать это наверняка могут лишь разработчики браузеров или те, кто в этом очень хорошо разбирается. Я к таковым не отношусь )))

Ну а вообще в CSS очень много вариантов записи цвета. Здесь их даже не будут пытаться привести, поскольку это отдельная тема.

На этом всё. Подписывайтесь на канал или подключайтесь к Телеграм-каналу, чтобы ничего не пропустить.