CSS3 (Stand 2024)

Cascading Style Sheets

Table of content
  • Grundlagen CSS
  • CSS-Syntax und Selektoren
  • Eigenschaften der Schrift
  • Texteigenschaften
  • Farben 
  • Hintergründe
  • Listen
  • Abstände und Rahmen
  • Tabellen
  • Positionieren
  • Inhalte und Zähler
  • Layout mit CSS
  • Formulare umgestalten
  • Ausdruck optimieren
  • Stichwortverzeichnis
Table of content (CSS3_2024_Inhalt.pdf, 68.42 KB)
Extract (CSS3_2024_Info.pdf, 862.79 KB)
Target group

Web-Designer, Programmierer von Web-Anwendungen

Learning objectives

Erlernen der Formatierungssprache CSS

Information

Zu CSS
„Cascading Style Sheets“ (CSS) haben sich von einem reinen Beschreibungswerkzeug für die Textformatierung weiterentwickelt zu einem generellen Beschreibungswerkzeug für die Gestaltung von Web-Seiten (auf der Grundlage des HTML4-Standards). Dadurch wird eine Reihe von Vorteilen erzielt:

  • Einheitliche Gestaltung vieler Webseiten: Dadurch einfache Gewährleistung eines „Corporate Designs“ (noch einfacher als über die Verwendung von Templates).
  • Einfachere Änderung der Gestaltung aller Seiten einer Site, ohne sie einzeln in die Hand nehmen zu müssen.
  • Geringere Netzbelastung, weil die einzelnen Seiten keine Detailformatierungen mehr enthalten; geschweige denn, dass die einzelnen Teile einer Seite immer wieder dieselben Angaben enthalten müssten.
  • Alternative Gestaltung desselben Inhalts für unterschiedliche Medien, z.B. für die Druckausgabe oder für andere Präsentations-Plattformen (z.B. WAPs oder Großbildschirme).
  • Leichtere Beachtung der inzwischen gesetzlich verordneten Barrierefreiheit durch Einbau zusätzlicher Informationen, ohne das Design stören zu müssen oder ohne spezielle Seiten-Varianten erstellen zu müssen.
  • Möglichkeit, denselben Inhalten alternative Darstellungen zu verpassen, um auf unterschiedliche geschmackliche Vorlieben Rücksicht zu nehmen (wie z.B. weniger Farbgebung oder weniger Graphikanteile). Der Betrachter kann diese Alternativen (z.B. unter Mozilla) auswählen, ohne dass dadurch eine Neu-Übertragung der Inhalte erforderlich wäre.

Insbesondere das Thema „Barrierefreiheit“ (als Oberbegriff zu „Behindertengerechtigkeit“) erzwingt den Einsatz von CSS2, wenn der Aufwand zur Erfüllung der unmittelbaren gesetzlichen Auflagen erträglich bleiben soll.
Die aktuelle Version des entsprechenden W3C-Standards (CSS2) aus dem Jahr 1998 wird leider (noch) nicht von allen Browsern (insbesondere vom MS-Explorer) unterstützt, was eine besondere Disziplin oder Zurückhaltung bei der Auswahl der einzusetzenden Sprachmittel erfordert; dies ist ein Umstand, den – hoffentlich – die Zeit heilt. Hier helfen vorerst die W3C-Validatoren weiter.
Andererseits sind von der nächsten Version (CSS3) wesentliche Erweiterungen zu erwarten wie z.B. nicht-rechteckige Seitenausschnitte (DIVs), mehr Hintergrund- und Rahmenvariationen, vertikale (gedrehte) Texte, bessere Interaktion mit dem Benutzer, Unterstützung für Sprachhinterlegungen, XSL-Unterstützung für XML-Komponenten und anderes mehr. In Hinblick auf die oben erwähnte Browser-Problematik dürften aber mit der Umsetzung noch ein paar Jahre vergehen.
Dipl.-Phys. Günther Schwichtenberg, Leiter des HRZ der Universität Dortmund

"CSS - was sonst?",, Günter Schwichtenberg in der ComputerPostille 3/2004 des HRZ der Universität Dortmund

Review

Rezensionen zum Vorgänger-Handbuch »CSS«. Was Hochschulmitglieder dazu meinen:

"Ich empfehle das CSS-Buch, weil es wirklich gut ist.“"
Katrin Proschek, Dipl.-Ing. (FH), Rechenzentrum - Labor für Multimedia und Datenbanken, FH Nürnberg

“Ein sehr gutes Buch, das sich gut in eine entsprechende Veranstaltung integrieren lässt. Der Inhalt wird verständlich und logisch vorgestellt. CSS(1-3) wird zwar nicht vollständig behandelt; die Auswahl ist aber sinnvoll. Die Beispiele sind eigentlich immer im richtigen Umfang (nicht zu klein und nicht zu umfangreich). Sie stützen aber jeden Fall das im Text Gesagte.Überzeugt hat mich auf Anhieb die Konstruktion einer Webseite ohne Tabellen, nur mit CSS-Eigenschaften. Das Beispiel ließe sich sicherlich noch ausbauen.
Kritikpunkte gibt es aber auch: Inkonsistenter Gebrauch der Begriffe „Element“ und „Tag“. Keine besondere Darstellung variabler Teile. Rechtschreib-, Grammatik- und sachliche Fehler halten sich in Grenzen.Einige Formulierungen würde ich ändern; aber das ist wie immer zum großen Teil Geschmackssache.
Ein erstaunlich gutes Buch!“
Günter Partosch, Hochschulrechenzentrum, Universität Gießen

„Das Heft CSS Level 2 ist wieder einmal eine gelungene Arbeitshilfe beim Erstellen von Internetseiten! Kompakt, korrekt, einfach im Erläutern und extrem übersichtlich ist es eine hervorragende Arbeitshilfe. Insbesondere die konsequente Berücksichtigung der unterschiedlichen Browser verdient grösste Würdigung. Ich freue mich, wenn wir unseren Studenten dieses Heft zur Verfügung stellen können.“
Professor Dipl.-Ing. (Univ.) Franz Josef Krichenbauer, Lehrgebiet Baubetrieb, FH Biberach

„Das Buch ist unter didaktischen Gesichtspunkten ausgezeichnet aufgebaut. Schon in der Einführung wird auf Techniken Bezug genommen, die der Leser vermutlich kennt (Formatvorlagen in Textverarbeitungsprogrammen wie Word oder Word Perfect) und verglichen mit der neu kennen zu lernenden Technik (css).
Es ist sehr gut, dass viele Beispiele vorhanden sind. Der Quellcode wird im Buch abgedruckt, so dass sie jederzeit nachvollziehbar - und auch veränderbar sind, um eigene Ideen auszuprobieren und zu testen. Da sie auch zum Download bereitstehen, ist auch für die gesorgt, die statt viel zu tippen lieber gleich die kompletten Beispiele testen möchten.
Die Beispiele sind in der Regel sehr gut geschrieben. Sie konzentrieren sich jeweils auf die kennenzulernende Eigenschaft, bzw. auf Variierung der Werte und sind dadurch hilfreich und übersichtlich.
An den Beispielen ist sehr auffällig, dass deutsche Umlaute dort nicht als html-entities codiert sind, sondern als Umlaut direkt verwendet werden. Zumindest sollte darauf hingewiesen werden, dass dies im internationalen Bereich Probleme bereiten kann - eine Verwendung der Entities (z. B. "ä" statt "ä") wäre besser.
Wie stets im Bereich der IT-Bücher sind wieder neue Versionen herausgekommen (CSS 2.1 am 25.2.2004 W3C Candidate Recommendation, neue Browserversionen, insbesondere der Firebird 1.0 seit 14.12.2004), so dass die Angaben aktualisiert werden können.
Das Buch deckt die verschiedenen Themenbereiche von css sehr gut ab. Es fehlen nur wenige Themen:
Bei den Grundlagen ist unter Vor- und Nachteilen von CSS ein kurzer Hinweis zu finden, der in Richtung Barrierefreiheit deutet - da die Forderung nach Barrierefreiheit für neue Auftritte ein immer größeres Gewicht bekommen wird und CSS eine wesentliche Technologie ist, um sie zu erreichen, sollte dies auch in dem Buch ein größeres Gewicht bekommen. Sowohl in der Einführung als auch bei den betreffenden Themen, wie z. B. Kapitel 13 "Layout ohne Tabellen".
In den Kapiteln 15 und 16 wird auf die beiden Ausgabemedien Ausdruck und Sprachausgabe eingegangen. Es fehlt ein Kapitel zu Screenreadern.
Die Vererbung von Eigenschaften wird zwar vorgestellt, jedoch fehlt in diesem Zusammenhang die Kaskadierung. Insbesondere sollte auf mögliche Probleme eingegangen werden. Evtl. wären diese beiden Themen ein eigenes Kapitel wert.
Die Tabellen, die bei Vorstellung neuer Eigenschaften übersichtlich Name, mögliche Werte, Standardwert und Anderes mehr aufzeigen sind ausgezeichnet. Es wäre zusätzlich sehr gut, im Anhang gesammelt, als Referenz, zu haben.
Insgesamt ein ausgezeichnetes Buch in gewohnter Herdt-Qualität, das sich hervorragend auch zum Selbststudium eignet.“
Sabine Hüser, Hochschulrechenzentrum der Universität Dortmund

"Dem Autor ist eine sehr gute Zusammenfassung des Themas CSS gelungen, die durch die vielen Anwendungsbeispiele für den praktischen Einsatz geeignet ist."
Katrin Proschek, Rechenzentrum, Labor für Multimedia und Datenbanken, Fachhochschule Nürnberg

„Das ist sehr fundiert und mit vielen Beispielen auch sehr gut nachvollziehbar geschrieben. Es beinhaltet alles, was man über den Standard CSS wissen muß, um ihn erfolgreich einsetzen zu können. Es führt den Webautoren weg vom „Gebastele“ mit Tabellen und JavaScript hin zu einem strukturierten und übersichtlichen Webdesign.
Ausführlich werden in den ersten Kapiteln die Grundlagen von CSS erläutert, so dass sie jeder nachvollziehen kann. In den letzten Kapiteln werden dann sogar Teile des Standard erwähnt und vorgestellt, welche praktisch von noch keinem Browser umgesetzt werden können. Besonders lobenswert ist es, dass immer angeführt wird, wie diese Eigenschaft in den Browsern implementiert ist. Sogar der Browser Amaya wurde dazu getestet.
Das Buch kann uneingeschränkt empfohlen werden.“
Frank Schulze, Rechenzentrum der TU Dresden

Insgesamt ein ausgezeichnetes Buch in gewohnter Herdt-Qualität, das sich hervorragend auch zum Selbststudium eignet.“
Das Buch ist auf jedenfall im Hochschulbereich gut einsetzbar.
Das Buch ist unter didaktischen Gesichtspunkten ausgezeichnet aufgebaut. Schon in der Einführung wird auf Techniken Bezug genommen, die der Leser vermutlich kennt (Formatvorlagen in Textverarbeitungsprogrammen wie Word oder Word Perfect) und verglichen mit (Formatvorlagen in Textverarbeitungsprogrammen wie Word oder Word Perfect) und verglichen mit der neu kennenzulernenden Technik (css).
Es ist sehr gut, das viele Beispiele vorhanden sind. Der Quellcode wird im Buch abgedruckt, so dass sie jederzeit nachvollziehbar und auch veränderbar sind, um eigene Ideen auszuprobieren und zu testen. Da sie auch zum Download bereitstehen, ist auch für die gesorgt, die statt viel zu tippen lieber gleich die kompletten Beispiele testen möchten
An den Beispielen ist sehr auffällig, daß deutsche Umlaute dort nicht als html-entities codiert sind, sondern als Umlaut direkt verwendet werden. Zumindest sollte darauf hingewiesen werden, das dies im internationalen Bereich Probleme bereiten kann - eine Verwendung der Entities (z. B. "ä" statt "ä") wäre besser.
Dipl.-Phys. Günter K. F. Schwichtenberg, Leiter des HRZ der Universität Dortmund

Das Handbuch steht als eBook zur Verfügung.

Dieses Handbuch ist eine unveränderte Seminarunterlage des Herdt-Verlages.

Neu: Webcode im Handbuch zum Herunterladen von Beispiel-, Übungs- und Ergebnisdateien

Verkauf von Handbüchern

Extern: siehe Verkaufsstellen

Verkauf an der LUH:

Handbuch-Team
Verkauf von Montag bis Donnerstag 08:00 – 16:00 Uhr sowie Freitag von 08:00 – 14:00 Uhr
Address
Leibniz Universität IT Services
Auskunft
Schloßwender Straße 5
30159 Hannover
Building
Handbuch-Team
Verkauf von Montag bis Donnerstag 08:00 – 16:00 Uhr sowie Freitag von 08:00 – 14:00 Uhr
Address
Leibniz Universität IT Services
Auskunft
Schloßwender Straße 5
30159 Hannover
Building