W3.CSS Kleure


Die verstekkleurskema wat in W3.CSS gebruik word, is geïnspireer deur Materiaalontwerpkleure (kleure wat in bemarking, padtekens en plaknotas gebruik word).


HTML-elemente inkleur

Die w3- kleur- en w3-teks- kleurklasse kan gebruik word om enige HTML-element in te kleur :

Houers:

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Knoppies:

Teks:

Rooi Pers Blou Groen Oranje

Grense:

Rooi

Groen

Blou

Geel

Grys

Swart

Tabelle:

Naam Punte
Jill Smith 50
Eva Jackson 94
Adam Johnson 67

Kaarte:

'n Motor is 'n wiel, selfaangedrewe motorvoertuig wat vir vervoer gebruik word. Die meeste definisies van die term spesifiseer dat motors ontwerp is om hoofsaaklik op paaie te hardloop, om sitplek vir een tot agt mense te hê, om tipies vier wiele te hê. (Wikipedia)



Agtergrond kleure

Die w3 - kleurklasse stel die agtergrondkleur vir enige HTML-element:

Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.


Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.


Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Voorbeeld

<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>

Die kleure grys en grys is uitruilbaar in alle W3.CSS-klasse.


Teks kleure

Die w3-teks-kleurklasse stel die tekskleur van enige HTML-element:

Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Voorbeeld

<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>


Beweeg kleure

Die w3-sweef-kleurklasse definieer die agtergrondsweefkleur vir enige HTML-element:

Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Voorbeeld

<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>

Die w3-sweef-teks-kleurklasse definieer die tekssweefkleur vir enige HTML-element:

Londen

Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.

Voorbeeld

<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>

Kleur biblioteke

Benewens standaard W3.CSS-kleure, kan W3.CSS ook kleure van baie verskillende kleurbiblioteke gebruik:

Windows kleure:

Lemmetjie
Groen
Olyf
smaraggroen
Blauwgroen
Staal
Siaan
Blou
Indigo
Kobalt
Viooltjie
Mauve
Pienk
Magenta
Rooi
Oranje
Amber
Geel
Bruin
Taupe
sienna
Karmosyn

Klik hier om meer te wete te kom oor Windows-kleure


Modekleure:

Vlam
Groen
Marina
Primrose
Geel
Neutraal grys
Skadu
spar
Navy
Pioen
Tawny
Port

Klik hier om meer te wete te kom oor modekleure


snelweg kleure:

Rooi
Groen
Blou
Geel

Klik hier om meer te wete te kom oor kleurbiblioteke

Jy sal baie meer oor kleure in latere hoofstukke van hierdie tutoriaal leer.