CSS (Cascading-Stylesheet-Document) ist eine nicht wegdenkbare Web-Technologie, die bei modernen Websites zur Formatierung, Positionierung und Verschönerung verwendet wird. Dieses Tutorial beschreibt die Grundlagen dieser wichtigen Technik.

CSS ist die Abkürzung von "Cascading Stylesheet Document". Es hilft einem Webentwickler das Aussehen einer Seite zu gestalten. Mehr oder weniger ist CSS eine Erweiterung für HTML. Man könnte also sagen HTML ist für den Inhalt verantwortlich und CSS ist für das Design zuständig.

Daraus folgt, dass man für CSS auch HTML benötigt. Für HTML benötigt man aber nicht zwingend CSS. Man könnte auch sagen, dass man für das Design einen Inhalt braucht, nicht aber ein Design für den Inhalt. Trotzdem hat heute jede Website ein mehr oder weniger ansprechendes Design, für das meist/immer CSS verantwortlich ist.

Für die Beispiele wird der Editor Topstyle verwendet.

Ein CSS Dokument hat die Endung *.css und besitzt kein Grundgerüst. Dadurch wird der Code übersichtlicher. In CSS arbeitet man mit Teilbereichen. Beispielsweise weist man im HTML-Code dem Inhalt-Bereich der Website den Namen "content" zu und in CSS möchte man die Schrift Orange färben. Das würde dann so aussehen: Die offene Klammer zeigt den Beginn der Formatierung des Bereichs an, die geschlossene schließt ihn wieder. Wichtig ist auch das Semikolon (;) am Ende der Zeile, da dieses die Anweisung abschließt. Das "#FF4500" ist ein Farbcode, dargestellt im Hexadezimalsystem.

Der Farb-Code steht in diesem Fall für Orange.

Jetzt haben wir die CSS-Datei, aber haben in der HTML-Datei noch nicht den Bereich "content" festgelegt. Dies geschieht mit einem DIV-Container. Wie man einen solchen benutzt wird im nächsten Kapitel beschrieben.