Style Sheets (zu deutsch etwa „Stilvereinbarungen“) sind das heutige Gestaltungsmittel für Webseiten. Während Sie mit Ur-HTML ebenfalls viele Möglichkeiten haben, bietet sich CSS ergänzend beziehungsweise heute fast ausschließlich an, um Webseiten einen „Style“ zu geben.
Wie Skripte gehören Style Sheets nicht zu HTML an sich. Es steckt dahinter eine eigenständige Technik. Die von Anfang an geforderte Trennung von Informationen und Gestaltung kann so erreicht werden. Somit haben Sie eine klare Struktur. Auch bietet das Auslagern große Vorteile in Bezug auf Wartung und Wiederverwertbarkeit.
Style Sheets sind keine eigene Sprache. Es dienen Regeln, die einen gewissen Standard definieren. Im Web hat sich der CSS-Standard (Cascading Style Sheets) durchgesetzt. Er ist das Maß der Dinge.
Vorteile von css:
Der Code kann in einer externen Datei ausgelagert werden. Somit kann er auf mehreren Seiten wiederverwendet werden. Eine änderung wirkt sich so auf das gesamte Projekt aus.
- Es müssen Style-Informationen nur einmal definiert werden.
- Richtig eingesetzt minimiert CSS die Größe der Webseite
- Wie auch JavaScript wird CSS über einen eigenen Container definiert
Definieren wir einmal zwei kleine Absätze. Der „Versuch1“ wird auf den SPAN-Tag angewendet. „Versuch2“ findet auf einem P-Tag Anwendung. Wie Sie sehen können, werden die Style-Informationen in geschweiften Klammern gefasst. Jeder Befehl wird mit einem Doppelpunkt von der übergabe getrennt. Ein abschließendes Semikolon dürfte keinem Programmierer schwerfallen. Sie können innerhalb einer Definition verschiedene Elemente ansprechen. Im zweiten Beispiel ändern wir neben dem Font auch die Textausrichtung. Die Reihenfolge der Befehle ist unerheblich.
.versuch1 {
font-weight: bold;
}
.versuch2 {
font-family: Arial;
font-style: italic;
text-align: center;
}
<span class="versuch1">Text im Style der Definition Versuch1</span>
<p class="versuch2">Text im Style der Definition Versuch2</p>