Teil 1 Websitegestaltung mit CSS Cascading Style Sheets

Erklärung CSS • CSS = Cascading Style Sheets (Design für Websites) • Textdatei mit Gestaltungsanweisungen • Eine CSS-Datei für ALLE HTML-Seiten!

CSS-Formatvorlagen zuweisen 3 Varianten, CSS einzubinden: • Direkt im HTML-TAG als Attribut • Einbinden von CSS im Kopf der HTML-Datei • Einbinden über externe CSS-Datei

Variante 1: Inline style Direkt im HTML-Befehl als Attribut

Variante 2: Internal style sheet CSS einbinden im Kopf der HTML-Datei

Variante 3: External style sheet CSS einbinden über externe CSS-Datei Die CSS-Datei muss im selben Verzeichnis wie die HTML-Datei sein!

Die bevorzugte Variante àExterne CSS-Datei von jeder HTML-Seite einbinden! <link href=„design. css" rel="stylesheet“ media =„screen“> • • link – verknüpft eine Datei mit einer anderen href – gibt den Pfad zu einer Datei an rel – engl. relation; Stylesheet für eine HTML-Datei media=„screen“ – Ausgabemedium = Bildschirm

Kommentare in CSS Folgendes wird benötigt: /* Inhalt */ Zur Erinnerung: in HTML <!- - Inhalt - ->

Aufbau CSS-Anweisung Schreibweise für CSS-Formatvorlagen: Selektor {Deklaration; } Eigenschaft: Wert; Bsp. : h 1 {color: red; }

Bitte beachten CSS-Angaben: • Alles zwischen den geschweiften Klammern gehört zum Selektor. • Der Doppelpunkt dient dazu, die Eigenschaft abzuschließen. • Der Strichpunkt dient als Trennung der einzelnen CSS-Anweisungen.