Moin!
Wenn ich weiter unten wieder einen Text schrieben will in h1 in einer anderen Farbe bzw. in standardfarbe, was ist dann los?
Da bringt mir das CSS doch nichts, oder?
Nehmen wir folgendes an:
h1 { color:#0f0; ... } /* Überschriften sind grundsätzlich grün */
Du kannst dann eine unabhängige Klasse definieren:
.blau { color:#00f; ... } /* Klasse blau */
.rot { color:#00f; ... } /* Klasse rot */
und dann der Überschrift eine Klasse zuweisen:
<h1 class="blau">Blaue Überschrift</h1>
Viel schöner wirkt das Prinzip aber, wenn man eine abhängige Klasse definiert.
h1 { color:#000; font-weight:normal; text-decoration:none; }
p { color:#00F; font-weight:normal; text-decoration:none; }
b { color:#00F; font-weight:bold; text-decoration:none; }
Damit sind drei Tags formatiert. Wenn du jetzt einige Passagen besonders hervorheben willst, kannst du das über eine Klasse "hervorheben" machen - und zwar pro Tag verschieden:
h1.hervorheben { color:#F00; font-weight:bold; text-decoration:none; }
p.hervorheben { color:#00F; font-weight:normal; text-decoration:underline; }
b.hervorheben { color:#FF0; font-weight:bold; text-decoration:blink; }
Mit diesem Satz CSS-Formatieranweisungen kannst du jetzt normale Überschriften, Absätze und fetten Text schreiben, und durch <h1 class="hervorheben">, <p class="hervorheben"> oder <b class="hervorheben"> einfach bestimmte Teile hervorheben, ohne daß du dich noch erinnern mußt, wie die passende Klasse dazu denn geheißen hat: Wenn etwas im definierten Stile der Seite hervorgehoben werden soll, dann ist dafür die Klasse "hervorheben" zuständig.
Natürlich macht es unter Umständen Sinn, eine allgemeine Klasse "hervorheben" zuerst zu definieren, damit alle Tags hervorgehoben werden können, und danach spezielle Definitionen für einzelne Tags nochmal umzuändern.
- Sven Rautenberg