Ressourcen: 16 Graustufen in HTML - Kombination von Farbe gray221 und Farbwert #eeeeee

Graustufen enthalten insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 16 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 15 (d.h. hexadezimal 0 bis f) für r, g und b.

Beispiele zur Kombination von Farbe gray221 und Farbwert #eeeeee

Hintergrund/Text-Kombination bei HTML-Befehl ins

Wir ändern für dieses Beispiel die Textfarbe von <ins> auf Farbwert #eeeeee und die Hintergrundfarbe von <ins> auf Farbe gray221. Als Schriftart setzen wir sans-serif. Die Schriftgröße ändern wir auf 9px.

<style type="text/css"><!--
  ins { 
    font-family:sans-serif; 
    font-size:9px; 
    color:#eee; 
    background-color:gray221;
  }
//-->
</style>

Weiteres zum hier genutzten HTML-Tag ins finden Sie in der HTML Referenz unter <ins>.

Zebra-Effekt von HTML-Befehl th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man von einem so genannten Zebra-Effekt. Der Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .odd und .even für <th> mit den Hintergrundfarben Farbe gray221 und Farbwert #eeeeee.

<style type="text/css"><!--
  th.odd { 
    background-color: gray221;
  }
  th.even { 
    background-color:#eee;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd verwendet.

<table>
<tr><td class="odd">Y1,1</td><td class="even">Y2,1</td><td class="odd">Y3,1</td></tr>
<tr><td class="odd">Y1,2</td><td class="even">Y2,2</td><td class="odd">Y3,2</td></tr>
<tr><td class="odd">Y1,3</td><td class="even">Y2,3</td><td class="odd">Y3,3</td></tr>
</table>

Weiteres zum Thema th erfahren Sie in Tabellen in HTML. Die Beschreibung des Tag th finden Sie in der HTML Referenz unter <th>.