CSS

Aus Online Marketing Wiki
Wechseln zu: Navigation, Suche

CSS steht für Cascading Style Sheets, was soviel bedeutet wie stufenförmige oder (hintereinander) geschachtelte Gestaltungsvorlagen. Während mit HTML Webseiteninhalte strukturiert werden, wird mit CSS deren Darstellung bzw. Formatierung, also bspw. das Layout, Schriftgrößen und -arten sowie Farben, festgelegt. Darüber hinaus können mit CSS Hintergrundbilder oder sonstige Elemente frei positioniert und ausgerichtet werden.

Die 1994 von Hakon Wium Lie vorgeschlagene und dann gemeinsam mit Bert Bros entwickelte CSS Programmierung ist heute die Standard Style-Sheet-Sprache für die Gestaltung von Webseiten.


Vorteile

Die Verwendung von CSS gegenüber der Formatierung direkt in der HTML-Datei hat Vorteile:

Neben der Möglichkeit, Inhalte und Darstellung zugunsten der Übersichtlichkeit strikt zu trennen, lässt sich mittels CSS die Formatierung für unterschiedliche Bereiche einer Webseite einheitlich in einer Formatvorlage vornehmen, ohne für jeden Bereich wiederholt die gleiche Formatierung im HTML-Code angeben zu müssen. Auch wenn später Änderungen erfolgen sollen, muss nur die Formatvorlage z.B. für die verwendete Schriftart oder -größe in der externen CSS-Datei angepasst und nicht der Code jeder einzelnen HTML-Datei umgeschrieben werden, um die Änderung umzusetzen.

Mit CSS können darüber hinaus unterschiedliche Darstellungen für jedes Ausgabemedium festgelegt werden, um Inhalte optimal ausliefern zu können. So kann bspw. für einen Projektor ein anderes Layout definiert werden als für einen Bildschirm oder ein Smartphone.


Beispiel eines CSS-Befehls

Eine beispielhafte Syntax für einen CSS-Befehl sieht folgendermaßen aus:

body{
text-align:center;font-Family:times;
color:black;
}

In diesem Beispiel wird der sichtbare Inhalt der Webseite („body“), also der gesamte Text, zentriert sowie mit der Schriftart Times New Roman und in der Schriftfarbe schwarz dargestellt.

Möchte man die Schriftart und Schriftfarbe des gesamten Textes der Webseite ändern und nun bspw. die Schriftart „Verdana“ und die Schriftfarbe rot verwenden, muss nur das jeweilige Code-Element in der CSS-Datei angepasst werden. Die Syntax würde dann wie folgt lauten:

body{
text-align:center;font-Family:verdana;
color:red;
}