W3.CSS Kolory


Domyślny schemat kolorów używany w W3.CSS jest inspirowany kolorami Material Design (kolory używane w marketingu, znakach drogowych i karteczkach samoprzylepnych).


Kolorowanie elementów HTML

Klasy w3 - color i w3- text- color mogą być użyte do pokolorowania dowolnego elementu HTML:

Kontenery:

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Guziki:

Tekst:

Czerwony Fioletowy Niebieski Zielony Pomarańczowy

Granice:

czerwony

Zielony

Niebieski

Żółty

Szary

Czarny

Tabele:

Nazwa Zwrotnica
Jill Smith 50
Ewa Jackson 94
Adam Johnson 67

Karty:

Samochód to kołowy pojazd silnikowy z własnym napędem używany do transportu. Większość definicji tego terminu określa, że ​​samochody są zaprojektowane do poruszania się głównie po drogach, mają siedzenia dla jednej do ośmiu osób, zazwyczaj mają cztery koła. (Wikipedia)



Kolory tła

Klasy kolorów w3 ustawiają kolor tła dla dowolnego elementu HTML:

Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.


Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.


Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Przykład

<div class="w3-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

<div class="w3-yellow">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

<div class="w3-gray">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

Kolory szary i szary są wymienne we wszystkich klasach W3.CSS.


Kolory tekstu

Klasy w3-text- color ustawiają kolor tekstu dowolnego elementu HTML:

Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Przykład

<div class="w3-text-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>


Kolory kursora

Klasy w3-hover- color definiują kolor tła dla dowolnego elementu HTML:

Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Przykład

<div class="w3-container w3-orange w3-hover-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom, with a metropolitan area of over 9 million inhabitants.</p>
</div>

Klasy w3-hover- text- color definiują kolor najechania na tekst dla dowolnego elementu HTML:

Londyn

Londyn to najbardziej zaludnione miasto w Wielkiej Brytanii, z obszarem metropolitalnym liczącym ponad 9 milionów mieszkańców.

Przykład

<div class="w3-container w3-orange w3-hover-text-white">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom, with a metropolitan area of over 9 million inhabitants.</p>
</div>

Biblioteki kolorów

Oprócz standardowych kolorów W3.CSS, W3.CSS może również używać kolorów z wielu różnych bibliotek kolorów:

Kolory okien:

Limonka
Zielony
Oliwa
Szmaragd
Cyraneczka
Stal
Cyjan
Niebieski
Indygo
Kobalt
Fioletowy
Fiołkoworóżowy
Różowy
Magenta
czerwony
Pomarańczowy
bursztyn
Żółty
brązowy
Kolor ciemnoszary
sjena
Karmazynowy

Kliknij tutaj, aby dowiedzieć się więcej o kolorach systemu Windows


Kolory mody:

Płomień
Zieleń
przystań

Żółty wiesiołkowy
Neutralny Szary
Cieniowany
świerk
Granatowa
Piwonia
Tawny
Port

Kliknij tutaj, aby dowiedzieć się więcej o modnych kolorach


Kolory autostrady:

czerwony
Zielony
Niebieski
Żółty

Kliknij tutaj, aby dowiedzieć się więcej o bibliotekach kolorów

Dużo więcej o kolorach dowiesz się w kolejnych rozdziałach tego samouczka.