W3.CSS- Farben
Das in W3.CSS verwendete Standardfarbschema ist von Material Design Colors inspiriert (Farben, die in Marketing, Straßenschildern und Haftnotizen verwendet werden).
Einfärben von HTML-Elementen
Die Klassen w3- color und w3- text- color können verwendet werden, um jedes HTML-Element einzufärben :
Behälter:
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
Tasten:
Text:
Grenzen:
rot
Grün
Blau
Gelb
Grau
Schwarz
Tabellen:
| Name | Punkte |
|---|---|
| Jill Smith | 50 |
| Eva Jackson | 94 |
| Adam Johnson | 67 |
Karten:
Ein Auto ist ein fahrbares, selbstangetriebenes Kraftfahrzeug, das für den Transport verwendet wird. Die meisten Definitionen des Begriffs geben an, dass Autos hauptsächlich für den Straßenverkehr ausgelegt sind, Sitzplätze für ein bis acht Personen bieten und typischerweise vier Räder haben. (Wikipedia)
Hintergrundfarben
Die Klassen w3 -color setzen die Hintergrundfarbe für jedes HTML-Element:
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
Beispiel
<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 Farben grau und grau sind in allen W3.CSS-Klassen austauschbar.
Textfarben
Die Klassen w3- text- color setzen die Textfarbe jedes HTML-Elements:
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
Beispiel
<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>
Hover-Farben
Die Klassen w3-hover- color definieren die Hover-Hintergrundfarbe für jedes HTML-Element:
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
Beispiel
<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-hover- text- color - Klassen definieren die Text-Hover-Farbe für jedes HTML-Element:
London
London ist die bevölkerungsreichste Stadt im Vereinigten Königreich mit einem Ballungsgebiet von über 9 Millionen Einwohnern.
Beispiel
<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>
Farbbibliotheken
Zusätzlich zu den Standardfarben von W3.CSS kann W3.CSS auch Farben aus vielen verschiedenen Farbbibliotheken verwenden:
Windows-Farben:
Klicken Sie hier, um mehr über Windows-Farben zu erfahren
Modefarben:
_
Fichte
Pfingstrose
Port
Klicken Sie hier, um mehr über Modefarben zu erfahren
Autobahnfarben:
Klicken Sie hier, um mehr über Farbbibliotheken zu erfahren
In späteren Kapiteln dieses Tutorials erfahren Sie noch viel mehr über Farben.