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 українською.
