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

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

Zebra-Effekt bei Befehl th

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man vom so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <th> mit unterschiedlichen Hintergrundfarben Farbe gray221 und Farbwert #333333.

<style type="text/css"><!--
  th.ying { 
    background-color: gray221;
  }
  th.yang { 
    background-color: #333333;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd verwendet.

<table>
<tr><td class="ying">Pa.a</td><td class="yang">Pb.a</td><td class="ying">Pc.a</td></tr>
<tr><td class="ying">Pa.b</td><td class="yang">Pb.b</td><td class="ying">Pc.b</td></tr>
<tr><td class="ying">Pa.c</td><td class="yang">Pb.c</td><td class="ying">Pc.c</td></tr>
</table>

Mehr zum Thema finden Sie in Tabellen in HTML. Mehr zum hier genutzten Tag th finden Sie in der HTML Referenz unter <th>.

Hintergrund/Text-Kombination mit Befehl dd

Hier ändern wir die Textfarbe von <dd> auf Farbwert #333333 und die Hintergrundfarbe von <dd> auf Farbe gray221. Die Schriftart setzen wir auf courier new und setzen die Schriftgröße auf 13px.

<style type="text/css"><!--
  dd { 
    color: #333333; 
    font-size: 13px; 
    font-family: courier new; 
    background-color: gray221;
  }
//-->
</style>

Weiteres zum Thema dd lesen Sie in Listen und Glossare in HTML. Einzelheiten vom HTML-Tag <dd>.