HTML - Цвета
Цвета очень важны для хорошего внешнего вида вашего сайта. Вы можете указать цвета на уровне страницы, используя тег <body>, или вы можете установить цвета для отдельных тегов, используяbgcolor атрибут.
Тег <body> имеет следующие атрибуты, которые можно использовать для установки разных цветов:
bgcolor - устанавливает цвет фона страницы.
text - устанавливает цвет для основного текста.
alink - устанавливает цвет активных ссылок или выбранных ссылок.
link - устанавливает цвет связанного текста.
vlink- устанавливает цвет для посещенных ссылок - то есть для связанного текста, по которому вы уже нажимали.
Методы цветового кодирования HTML
Существует три различных метода установки цветов на вашей веб-странице:
Color names - Вы можете напрямую указать названия цветов, например зеленый, синий или красный.
Hex codes - Шестизначный код, представляющий количество красного, зеленого и синего цветов, составляющих цвет.
Color decimal or percentage values - Это значение указывается с помощью свойства rgb ().
Теперь мы рассмотрим эти схемы раскраски одну за другой.
Цвета HTML - названия цветов
Вы можете указать имя цвета, чтобы задать цвет текста или фона. W3C перечислил 16 основных названий цветов, которые будут проверяться валидатором HTML, но есть более 200 различных названий цветов, поддерживаемых основными браузерами.
Note- Проверьте полный список HTML Color Name.
Стандарт W3C 16 цветов
Вот список названий стандартных 16 цветов W3C, и рекомендуется их использовать.
| Черный | Серый | Серебряный | Белый | ||||
| Желтый | Лайм | Аква | Фуксия | ||||
| Красный | Зеленый | Синий | Пурпурный | ||||
| Бордовый | Оливковое | Флот | Бирюзовый |
пример
Вот примеры для установки фона тега HTML по имени цвета -
<!DOCTYPE html>
<html>
<head>
<title>HTML Colors by Name</title>
</head>
<body text = "blue" bgcolor = "green">
<p>Use different color names for for body and table and see the result.</p>
<table bgcolor = "black">
<tr>
<td>
<font color = "white">This text will appear white on black background.</font>
</td>
</tr>
</table>
</body>
</html>Цвета HTML - шестнадцатеричные коды
Шестнадцатеричное число - это 6-значное представление цвета. Первые две цифры (RR) представляют значение красного цвета, следующие две - значение зеленого цвета (GG), а последние - значение синего цвета (BB).
Шестнадцатеричное значение можно взять из любого графического программного обеспечения, такого как Adobe Photoshop, Paintshop Pro или MS Paint.
Каждому шестнадцатеричному коду будет предшествовать знак решетки или решетки #. Ниже приводится список нескольких цветов в шестнадцатеричной системе счисления.
| цвет | Цвет HEX |
|---|---|
| # 000000 | |
| # FF0000 | |
| # 00FF00 | |
| # 0000FF | |
| # FFFF00 | |
| # 00FFFF | |
| # FF00FF | |
| # C0C0C0 | |
| #FFFFFF |
пример
Вот примеры для установки фона тега HTML с помощью цветового кода в шестнадцатеричном формате:
<!DOCTYPE html>
<html>
<head>
<title>HTML Colors by Hex</title>
</head>
<body text = "#0000FF" bgcolor = "#00FF00">
<p>Use different color hexa for for body and table and see the result.</p>
<table bgcolor = "#000000">
<tr>
<td>
<font color = "#FFFFFF">This text will appear white on black background.</font>
</td>
</tr>
</table>
</body>
</html>Цвета HTML - значения RGB
Это значение цвета указывается с помощью rgb( )свойство. Это свойство принимает три значения, по одному для красного, зеленого и синего цветов. Значение может быть целым числом от 0 до 255 или процентом.
Note - Все браузеры не поддерживают свойство цвета rgb (), поэтому не рекомендуется его использовать.
Ниже приведен список, показывающий несколько цветов с использованием значений RGB.
| цвет | Цвет RGB |
|---|---|
| rgb (0,0,0) | |
| RGB (255,0,0) | |
| rgb (0,255,0) | |
| RGB (0,0,255) | |
| RGB (255,255,0) | |
| RGB (0,255,255) | |
| RGB (255,0,255) | |
| RGB (192,192,192) | |
| RGB (255,255,255) |
пример
Вот примеры для установки фона тега HTML с помощью цветового кода с использованием значений rgb ():
<!DOCTYPE html>
<html>
<head>
<title>HTML Colors by RGB code</title>
</head>
<body text = "rgb(0,0,255)" bgcolor = "rgb(0,255,0)">
<p>Use different color code for for body and table and see the result.</p>
<table bgcolor = "rgb(0,0,0)">
<tr>
<td>
<font color = "rgb(255,255,255)">This text will appear white on black background.</font>
</td>
</tr>
</table>
</body>
</html>Безопасные цвета для браузера
Вот список из 216 цветов, которые считаются самыми безопасными и независимыми от компьютера. Эти цвета варьируются от шестнадцатеричного кода 000000 до FFFFFF и будут поддерживаться всеми компьютерами, имеющими 256 цветную палитру.
| 000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
| 003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
| 006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
| 009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
| 00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
| 00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
| 330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
| 333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
| 336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
| 339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
| 33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
| 33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
| 660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
| 663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
| 666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
| 669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
| 66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
| 66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
| 990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
| 993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
| 996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
| 999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
| 99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
| 99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
| CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
| CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
| CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
| CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
| CCCC00 | CCCC33 | CCC66 | CCC99 | ССС | CCCCFF |
| CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
| FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
| FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
| FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
| FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
| FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
| FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |