<link rel=stylesheet type="text/css" href="style.css">
Hier der Inhalt der css Datei

body { margin-top:20px; margin-bottom:10px; }

p,h1,h2,h3,h4,b,i { font-family:Arial,sans-serif;}
p.blue { color:#ffffff; background-color:#00557F; }
h1 { font-size:18pt; }
/* Komentare werden in Style Sheets zwischen diese Zeichen gesetzt. Anfang und Ende des Komentars müssen in der gleichen Zeile stehen.*/
h2 { font-size:16pt; } h3 { color:blue; }


Überschrift erster Ordnung

Ganz normaler Text ohne irgendwelche Schriftformatierungen oder Style Sheets. Für die Schriftformatierung fetter Text, also b für bold wurde die Schriftart Arial oder sans-serif in dem Style Sheet definiert.

Wie man im Quelltext sehen kann, wird auf eine Datei namens style.css verwiesen. <link rel=stylesheet type="text/css" href="style.css">
In dieser reinen Textdatei steht nichts als die Style sheet Definitionen. Hier kann mal mal gucken.

Ja das ist auch so ne Überschrift, aber zweiter Ordnung.

Leider Gottes hat Netscape die ganze Style Sheet Sache bis jetzt sträflich vernachlässigt. Das soll ja nun ab der 6 er Version anders sein. Jedenfalls im Moment ist was Style Sheet anbetrifft Microsoft die bessere Wahl, ich schreib es ja nicht gerne, aber so ist es nun mal.

Diese H3 hat eine extra blaue Farbe.

Diese hier sieht anders aus, warum sieht man in der style.css und hier im Quellcode. Außerdem habe ich für diesen Absatz mit class=blue eine Hintergrundfarbe gewählt, die allerdings im Microsoft Explorer besser aussieht, weil der immer einen rechteckigen Block erzeugt, während Netscape die Farbe nur bis zum Ende der jeweiligen Zeile darstellt. Das finde ich persönlich nicht so schön.


Hier die 3 Möglichkeiten Style Sheets einzbinden.
Style Sheet im Head für die gesamte Seite.
Style Sheet für einzelne Tags.
Style Sheet in einer externen CSS Datei.(diese Seite)


Startseite