W3.CSS Цвета
Цветовая схема по умолчанию, используемая в W3.CSS, вдохновлена Material Design Colors (цвета, используемые в маркетинге, дорожные знаки и заметки).
Раскраска HTML-элементов
Классы w3-color и w3-text-color можно использовать для окрашивания любого элемента HTML:
Контейнеры:
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Кнопки:
Текст:
Границы:
Red
Green
Blue
Yellow
Gray
Black
Таблицы:
| Имя | Размер головы |
|---|---|
| Jill Smith | 50 |
| Eve Jackson | 94 |
| Adam Johnson | 67 |
Открытки:
Автомобиль - это самоходное транспортное средство на колесах, используемое для перевозки. В большинстве определений этого термина указывается, что автомобили предназначены для движения в основном по дорогам, для размещения от одного до восьми человек, обычно для четырех колес. (Википедия)
Цвета фона
Классы w3-color устанавливают цвет фона для любого элемента HTML:
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Пример
<div class="w3-red">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город Великобритании,
с населением более 9 миллионов жителей.</p>
</div>
<div class="w3-yellow">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город Великобритании,
с населением более 9 миллионов жителей.</p>
</div>
<div class="w3-gray">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город Великобритании,
с населением более 9 миллионов жителей.</p>
</div>
Попробуйте сами »
Цвета gray и grey являются взаимозаменяемыми во всех классах W3.CSS.
Цвета текста
Классы w3-text-color устанавливают цвет текста любого элемента HTML:
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Пример
<div class="w3-text-red">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город Великобритании,
с населением более 9 миллионов жителей.</p>
</div>
Цвета при наведении мыши
Классы w3-hover-color определяют цвет фона при наведении для любого элемента HTML:
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Пример
<div class="w3-container w3-orange w3-hover-red">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.</p>
</div>
Попробуйте сами »
Классы w3-hover-text-color определяют цвет текста при наведении на любой элемент HTML:
Лондон
Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.
Пример
<div class="w3-container w3-orange w3-hover-text-white">
<h2>Лондон</h2>
<p>Лондон - самый густонаселенный город в Соединенном Королевстве, с населением более 9 миллионов человек.</p>
</div>
Попробуйте сами »
Библиотеки цветов
В дополнение к стандартным W3.CSS цветам, W3.CSS также может использовать цвета из множества различных библиотек цветов:
Windows цвета:
Fashion цвета:
Yellow
Spruce
Peony
Port
Highway цвета:
Вы узнаете намного больше о цветах в последующих главах этого учебника на нашем сайте W3Schools на русском.
