~~NOTOC~~

[[htmlcss:html_css_lektion_04|=> Lektion 4: Schachteln von Tags]]

====== Lektion 5: Einführung in CSS ======

Um weitere Tags und Attribute in HTML verstehen zu können, ist es nun notwendig, einen ersten kleinen Einblick in CSS zu bekommen.

Für die Internetseite http://www.csszengarden.com/tr/deutsch/ wurden mit CSS verschiedene Layouts geschaffen, dabei bleibt der Inhalt immer derselbe.

===== Was ist CSS ? =====

**C**ascading **S**tyle **S**heets

Während man in HTML nur die Bedeutung einzelner Abschnitte mit ihren Inhalten auszeichnet, wird mit CSS das Layout einer Seite verwirklicht. Es handelt sich allerdings nur um einen Layoutwunsch bzw. Layoutvorschlag. Wie der jeweilige Browser das Ergebnis anzeigt, hängt ganz von der verwendeten Software des Benutzers ab.

Man kann CSS-Befehle entweder in die HTML-Datei einbinden oder, was üblich ist, in eine gesonderte CSS-Datei auslagern, auf die in der HTML-Datei verwiesen wird.

{{  :htmlcss:work_64.png|}}
===== Übung 7 =====

Gehe auf http://fwpf-webdesign.de/css und lies dir die //Grundlagen// zu CSS durch. Bearbeite dabei folgende Fragen/Aufgabe((Cut'n'Paste ist verboten!)):

  - Erkläre den Aufbau des ''style''-Attributs?
  - Wo und wie können ''style''-Elemente definiert werden?
  - ''style''-Attribute und ''style''-Elemente sollten weniger verwendet werden, warum?
  - Was ist eine Deklaration?
  - Beschreibe den Aufbau eines Deklarationsblocks in CSS.
  - Wie lautet der Befehl, der eine externe css-Datei in eine html-Datei einbindet?
  - Lege eine layout.css-Datei an, in der nur für die h1-Überschrift eine hellblaue (#ADD8E6) Hintergrundfarbe vorgesehen wird.
  - Binde die css-Datei in deine Startseite ein und überprüfe dein Ergebnis.

----
[[htmlcss:html_css_lektion_06|=> Lektion 6: DIVs als gruppierende Elemente]]\\ 
[[htmlcss:start|=> Übersicht: HTML und CSS]]