Teil 5 – Einführung in CSS

Kaskade (Cascade)

Was bedeutet „kaskadieren“?

„Kaskadieren“ bedeutet, dass sich Stilzuweisungen von einem Stylesheet mit denen eines anderen Stylesheets überlappen können. Dies erlaubt es, für ein HTML-Dokument mehrere Stylesheets zu benutzen.

Auch das einfachste HTML-Dokument kann drei oder mehr Stylesheets benutzen, da wären beispielsweise:

Browser-Stylesheets

Browser wenden Stile auf alle Web-Dokumenten an. Wenn diese Stylesheets sich auch von Browser zu Browser unterscheiden, haben sie dennoch Gemeinsamkeiten, wie z.B. schwarzer Text, blaue Links, lilafarbene besuchte Links, usw. Dies wird als das Standard-Browser-Stylesheet bezeichnet.

Sobald Sie (als Autor) ein Stylesheet auf ein Dokument anwenden, wird dieses das Browser-Stylesheet aufheben. Dies geschieht, weil die Autoren-Stylesheets immer die Browser-Stylesheets überschreiben.

Benutzer-Stylesheets

Ein Benutzer ist jeder, der sich Ihre Website ansieht.

Fast alle modernen Browser ermöglichen es den Benutzern, deren eigenen Stylesheets zu benutzen. Diese Stylesheets heben auch das Browser-Stylesheet auf - aber nur für diesen Benutzer.

Es ist wichtig zu wissen, dass die Benutzer sich eigene Text- und Hintergrundfarben für die Dokumente einstellen können. Wenn Sie, als der Autor, keine Text- oder Hintergrundfarbe angeben, kann ein Benutzer-Stylesheet angewendet werden. Noch wichtiger: Man sollte entweder Text- und Hintergrundfarbe angeben oder keins von beiden. Falls nur die Textfarbe angegeben wird und der Benutzer hat die gleiche Farbe als Hintergrundfarbe angegeben, wird Ihr gesamtes Dokument für diesen Benutzer nicht zugänglich sein

Autoren-Stylesheets

Der Autor ist die Person, die die Website gestaltet und entwickelt – Sie!

Sobald sie ein Basis-Stylesheet oder Inline-Styleangaben für das Dokument benutzen, haben Sie was benutzt, was man als strong>„Autoren-Stylesheet“ bezeichnet. Alles was Sie tun, angefangen vom Auswählen der Schriftart und der Farben bis hin zu dem Layout der Seite in CSS, wird durch Autoren-Stylesheets erreicht.

Autoren-Stylesheets können in einem HTML-Dokument integriert oder durch Verlinkung mit einer externen Datei benutzt werden. Ebenso kann man mehrere Stylesheets auf ein bestimmtest Dokument anwenden, um die Vorteile der Kaskade zu nutzen.

Im Allgemeinen überschreiben Autoren-Stylesheets Benutzer-Stylesheets, die wiederum Browser-Stylesheets überschreiben.

!important-Regeln

Man kann bei jeder Deklaration !important hinzufügen, dies wird alle anderen Deklarationen für das Element überschreiben. !important-Deklarationen überschreiben normale Deklarationen.

Bei !important-Deklarationen gilt, dass Benutzer-Stylesheets Autoren-Stylesheets überschreiben, die wiederum das Standard-Browser-Stylesheet überschreiben. Dies erlaubt es Benutzern mit speziellen Anforderungen (große Schriften, bestimmte Farbkombinationen, usw.), Kontrolle über die Darstellung zu erlangen.

Warum sollte man mehrere Autoren-Stylesheets einsetzen?

Stylesheets können benutzt werden, um verschiedene Arten von User-Agents zu bedienen. So kann ein einzelnes HTML-Dokument Links zu einer Vielzahl von Stylesheets beinhalten, z.B. ein Stylesheet für Sprachausgabe, eins für den Ausdruck und eins für die Darstellung am Bildschirm

Für eine große Website, möchte man evtl. eine Reihe von visuellen Stylesheets für jedes Dokument benutzen. Das könnte beispielsweise ein allgemeines Stylesheet sein (welches in allen Sektionen der Website angewendet wird) für die grundlegenden Schriftinformationen, um dann individuelle Stylesheets für jede Sektion der Website zu benutzen. Oder man kann bestimmte Teile eines Dokuments mit individuellen Stylesheets versehen. Man könnte beispielsweise ein Stylesheet für die Fußzeile benutzen, eins für die Navigation und welche für den allgemeinen Inhalt.

Es gibt keine Grenzen, wie weit man die Style-Informationen aufteilen kann. Das Ziel ist, Stylesheets so zu benutzen, dass die Information darin nicht in anderen Stylesheets wiederholt werden muss. Getreu dem Motto: Einmal anpassen und an vielen Stellen anwenden.