Учебник по HTML

HTML ГЛАВНАЯ Введение в HTML HTML-редакторы Базовый HTML HTML-элементы HTML-атрибуты HTML-заголовки HTML-абзацы HTML-стили HTML-форматирование HTML-цитаты HTML-комментарии Цвета HTML HTML CSS HTML-ссылки HTML-изображения HTML Фавикон HTML-таблицы HTML-списки Блок HTML и встроенный HTML-классы HTML-идентификатор HTML-фреймы HTML JavaScript Пути HTML-файлов HTML-голова HTML-макет HTML Отзывчивый HTML компьютерный код HTML-семантика Руководство по стилю HTML HTML-сущности HTML-символы HTML-смайлики HTML-кодировка HTML-кодирование URL-адреса HTML против XHTML

HTML -формы

HTML-формы Атрибуты HTML-формы HTML-элементы формы Типы ввода HTML Атрибуты ввода HTML Атрибуты формы ввода HTML

HTML- графика

HTML-холст HTML SVG

HTML- медиа

HTML-медиа HTML-видео HTML-аудио HTML-плагины HTML YouTube

HTML -API

HTML-геолокация Перетаскивание HTML Веб-хранилище HTML Веб-воркеры HTML HTML SSE

HTML- примеры

HTML-примеры HTML-викторина HTML-упражнения HTML-сертификат Резюме HTML Доступность HTML

HTML -ссылки

Список тегов HTML HTML-атрибуты Глобальные атрибуты HTML Поддержка HTML-браузера HTML-события Цвета HTML HTML-холст HTML-аудио/видео Типы документов HTML Наборы символов HTML HTML-кодирование URL-адреса Языковые HTML-коды HTTP-сообщения HTTP-методы Конвертер PX в EM Горячие клавиши

Цвета HTML


Цвета HTML задаются предопределенными именами цветов или значениями RGB, HEX, HSL, RGBA или HSLA.


Названия цветов

В HTML цвет можно указать с помощью имени цвета:

Помидор
апельсин
ДоджерСиний
СреднийМореЗеленый
серый
Сланцево-синий
Фиолетовый
Светло-серый

HTML поддерживает 140 стандартных названий цветов .


Фоновый цвет

Вы можете установить цвет фона для элементов HTML:

Привет мир


Боль сама по себе любовь Вот почему это для малейшего, кто наша обычная практика терпит, чтобы воспользоваться последствиями

Пример

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>

Цвет текста

Вы можете установить цвет текста:

Привет мир

Боль сама по себе любовь

Вот почему это для малейшего, кто наша обычная практика терпит, чтобы воспользоваться последствиями

Пример

<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>

Цвет границы

Вы можете установить цвет границ:

Привет мир

Привет мир

Привет мир

Пример

<h1 style="border:2px solid Tomato;">Hello World</h1>
<h1 style="border:2px solid DodgerBlue;">Hello World</h1>
<h1 style="border:2px solid Violet;">Hello World</h1>

Цветовые значения

В HTML цвета также могут быть указаны с использованием значений RGB, значений HEX, значений HSL, значений RGBA и значений HSLA.

Для следующих трех элементов <div> цвет фона установлен со значениями RGB, HEX и HSL:

RGB(255, 99, 71)
#ff6347
hsl(9, 100%, 64%)

Для следующих двух элементов <div> цвет фона установлен со значениями RGBA и HSLA, что добавляет к цвету альфа-канал (здесь у нас прозрачность 50%).

RGBA (255, 99, 71, 0,5)
hsla (9, 100%, 64%, 0,5)

Пример

<h1 style="background-color:rgb(255, 99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>

<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>

Узнайте больше о значениях цвета

Вы узнаете больше о RGB , HEX и HSL в следующих главах.