P { 
font-family : Verdana,Arial,Helvetica,sans-serif; 
font-size : 10px; 
color : #000000; 
text-align : center; }

<!-- Der Body ist praktisch der gesamte sichtbare Bereich einer Seite. Hier wird festgelegt die Hintergrundfarbe, die Schriftfarbe und das Aussehen der Rollbalken für Nutzer des Internet Explorers ab Version 5.5 -->

BODY { 
background-color : #000000; 
color : #FFFFFF; 
scrollbar-arrow-color : #FFFF00; 
scrollbar-highlight-color : #FF3300; }

<!-- Die Überschriften der Artikel sind dunkelblau. Weitere Überschriften etwa H3 oder H1 verwenden wir nicht, sicherheitshalber sind sie ebenfalls festgelegt. -->

H1,H2,H3 { 
font-family : Arial, Helvetica, sans-serif; 
color : blue; }

H4 {
color : green 
font-weight: bold; }

H5 {
color : white; 
font-weight: 800; }

H6 {
font-family : Verdana,Arial,Helvetica,sans-serif; 
font-size : 10px; 
color : #FF9933; 
text-align : center; }

<!-- Kursive Schrift wird grundsätzlich auch fett dargestellt. Grund: Kursive Schrift ist am Bildschirm meist schlecht zu lesen. Wir setzen sie selten ein. -->

I { 
font-style : italic; 
font-weight : bold; 
color : #6600FF; }

I.rot { 
color : #FF3333; }

<!-- Der folgende Bereich bezieht sich auf Absätze (p) sowie Listen. Hier werden Schriftart, Schriftgröße und der Zeilenabstand (Durchschuß) festgelegt. -->

OL,UL,DD { 
font-family : Verdana,Arial,Helvetica,sans-serif; 
line-height : 130%; 
font-size : 10px; }

<!-- Text, der sich innerhalb von Tabellen befindet, aber nicht in <p>-Tags eingeschlossen ist, wird anders formatiert. Davon betroffen sind tabellarische Listen im Ressourcenteil. Der darin enthaltene Text ist aufgrund der anderen Schriftype kleiner. -->

TD,TR { 
font-family : Arial,Helvetica,sans-serif; 
font-size : 14px; }

TH { 
font-family : Arial,Helvetica,sans-serif; 
font-size : 18px; }

<!-- Die Formatierung für Quellcodes, so wie auf dieser Seite, wird häufig angewendet. -->

CODE { 
font-family : Courier,Courier New,monospace ; 
color : #666666; 
background-color : #F4F4F4; }

<!-- Ein kleiner Effekt für Formularfelder. Wir verändern die Farbe, wenn man mit der Maus in einem solches Feld (zum Beispiel Suchfunktion) klickt. Der Effekt funktioniert nur mit Netscape 6 Browsern. -->

input:focus { 
background-color : #F4F4F4;}

<!-- Das Aussehen und Verhalten der Hyperlinks wird hier festgelegt. Neben der Farbe und der Unterstreichung sowie der Fettschrift wird auch der Farbwechsel (Hover-Effekt) definiert. -->

A:link { 
color : #3300FF; 
font-weight: bold; 
text-decoration: underline; }

A:visited { 
color : #FFFFFF; 
font-weight: bold;
text-decoration: underline; }

A:hover {
color: #FFFF00; 
font-weight: bold;
text-decoration: none; }

A:active {
color: #FF3300; 
text-decoration: none; }

<!-- Es folgenden allerlei selbstdefinierte Klassen. Zum Beispiel für besonders groß oder besonders klein geschriebene Texte. Diese Formatierungen tauchen aber nur selten auf. -->

.red { 
color : white; 
font-weight: normal; 
font-family : Arial, Helvetica, sans-serif;}

.gr { 
font-size : 30px; }

.kl { 
font-size : 10px; }

p.rot { 
color : #FF3300; 
font-weight: bold; }

.anz { 
color : darkgrey; }

<!-- Farbzuweisung für den Absende-Button (Submit) unserer Suchfunktion. -->

.bu { 
background-color : yellow;}

<!-- Alle Abbildungen liegen in Tabellen und werden mit einer Bildunterschrift (Legende) versehen. Sie wird speziell formatiert. -->

.leg { 
font-size : 82%; font-weight: bold; }

<!-- Ein auf dem Monitor nicht sichtbarer Text wird erzeugt. Seltsam oder? Aber das hat seine Richtigkeit. Der Text würde schließlich mit ausgedruckt ... -->

.uns { 
display : none; }

<!-- Fremde CSS-Dateien lassen sich in den meisten Browsern auch ganz direkt beobachten. Dateinamen und Pfad bekommt man durch einen Blick in die angezeigte Seite schnell heraus. Wem das zu kompliziert ist, der speichert die Seite einfach ab. Zumindest der Internet Explorer stellt einem dann sämtliche Dateien und Grafiken zur Verfügung. (sl) -->