HTML & CSS Javascript Perl PHP Index | Download | Suche 
HTML I Schnellkurs | Einführung | Grundgerüst | Text | Bilder | Links | Farben | Tabellen
HTML IITrennlinien , Listen | Hintergrundbilder | Frames | Formulare | Meta - Tags
CSS Einführung | Style Sheets definieren | einzelne Angaben
PLUS Hilfreiches / Tabellen | Software / Tools | Upload der Homepage | Hyperlinks
  FAQ / Goodies | Java | CGI / Perl | SSI
CSS : Einführung   ||   Was sind CSS ?Wozu CSS ?

Was sind CSS ?

Style Sheets sind Stilvorlagen. Sie erlauben es, Tags exakt zu formatieren sowie Unterklassen zu definieren, welche dann auf beliebige Tags angewendet werden können. Mit Hilfe von Style Sheets können projektweite Einstellungen zum Layout von einer Datei aus verändert werden. Das Layout wird so flexibler, der Quellcode schlanker.

[ Cascading ] Style Sheets sind eine Ergänzung zu HTML. Die erste Version von CSS (Cascading Style Sheets, Level 1) wurde im Dezember 1996 vom w3c - Konsortium veröffentlicht.
IE interpretiert CSS teilweise ab Version 3.0, recht gut ab 4.0, NN mehr schlecht als recht ab 4.0, gut ab Version 6.0. Übrigens surfen vielleicht 85% der Anwender mit Browsern der 4er- Generation oder höher, etwa gleich viel davon gebrauchen den Internet Explorer (Sommer 2000, Irrtümer vorbehalten :).

Eine der wichtigsten Funktionen von Style Sheets ist die Trennung von Inhalt & Layout. Meist werden die Angaben zum Layout in einer separaten Datei gespeichert (Textdatei mit Endung .css). Auf diese wird dann innerhalb der betreffenden HTML- Dokumente verwiesen. So können für ein bestimmtes Projekt alle Layout - Angaben in einer zentralen Datei gespeichert und verwaltet werden.
Projektweit ein neues Hintergrundbild? Bestimmte Tabellen oder Zellen in einer anderen Farbe? Eine andere Schrift? Mit Hilfe von CSS ist das alles (und noch einiges mehr) möglich. Bei reinem HTML wäre eine Änderung jedes einzelnen Dokumentes nötig, entweder manuell oder mit Hilfe eines Tools wie Multi - Replace, wobei die meisten HTML-Editoren (auch Ulli Meybohm's HTML-Editor :) ebenfalls eine solche Funktion integriert haben .

Nehmen wir als Beispiel diesen Kurs. Links seht ihr die Seite mit CSS, rechts ohne:

Und so sieht das zugehörige Style Sheet aus (Eine reine Text- Datei, also wie *.html , aber mit Endung *.css), welches das Layout für den gesamten Kurs regelt: (-das aktuelle Style Sheet befindet sich in diesem Verzeichnis unter der Bezeichnung a.css.)

Cascading Style Sheets werden heutzutage auf allen grösseren Webseiten eingesetzt.



Wozu CSS ?



 |  Weiter zum nächsten Kapitel : CSS definieren  | 
:::  © 2000/01 Martin Fux  :::  URL dieses Dokuments: http://www.flexdax.org/htmlkurs/css-start.html