Allgemeines

(Auszug aus "CSS Kochbuch" von Christopher Schmitt)

Einführung

Durch den Einsatz von Cascading Style Sheets (CSS) können Sie Ihre Webseiten auf einfache Weise mit Stildefinitionen versehen. Auf den ersten Blick wirkt CSS vielleicht schwierig. Daher zeigen wir in diesem Kapitel, wie einfach CSS tatsächlich ist. Die Rezepte dieses Kapitels vermitteln Ihnen die Grundlagen für einen schnellen Einstieg. Schreiben Sie einfach ein paar Zeilen HTML-Code, und fügen Sie ein wenig CSS hinzu, und schon sind die Ergebnisse sichtbar.

Unsere erste Übung beginnt mit dem traditionellen »Hallo Welt!«-Beispiel. Öffnen Sie als Erstes einen Texteditor oder Ihr bevorzugtes Programm zum Editieren von Webseiten, und geben Sie Folgendes ein:

<html>
  <head>
    <title>CSS Kochbuch</title>
  <head>
  <body>
    <p>Hallo Welt!</p>
  </body>
</html>

Speichern Sie die Datei und betrachten Sie sie in Ihrem Webbrowser. Wie in der folgenden Abbildung zu sehen ist, besitzt die dargestellte Zeile noch keinerlei Besonderheiten.

Standarddarstellung einer HTML-Seite ohne CSS

Abbildung: Standarddarstellung einer HTML-Seite ohne CSS.

Um den Stil des HTML-Textes so abzuändern, dass eine serifenlose Schrift verwendet wird, fügen Sie einfach ein wenig CSS-Code hinzu (siehe die folgende Abbildung):

<p style="font-family: sans-serif;">Hallo Welt!</p>

Text wird nun durch CSS in serifenloser Schrift dargestellt.

Abbildung: Mit Hilfe von CSS wird der Text nun in einer serifenlosen Schrift dargestellt.

Mit folgendem Code können Sie die Schriftgröße (font-size) auf 150% erhöhen, ohne dabei den Schriftstil selbst zu ändern, wie in der folgenden Abbildung gezeigt:

<p style="font-size: 150%">Hallo Welt!</p>
Tipp der data2type-Redaktion:
Zum Thema CSS bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright der deutschen Ausgabe © 2007 by O’Reilly Verlag GmbH & Co. KG
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "CSS Kochbuch" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

O’Reilly Verlag GmbH & Co. KG, Balthasarstr. 81, 50670 Köln