2020 ke

HTML und CSS

Idee HTML, CSS

  • HTML-Seiten enthalten und strukturieren Inhalte in Form von Texten, Bildern und anderen Objekten.

  • CSS-Anweisungen beschreiben die Darstellung und das Layout (Style) einer HTML-Seite.

Anzustreben ist die Trennung von Inhalt und Darstellung innerhalb der Site.

HTML-Elemente

HTML-Elemente wie Links, Bilder, DIVs etc. werden vom Browser je nach Element-Typ als

  • Inline-Elemente (hintereinander auf der selben Zeile)

oder als

  • Block-Elemente (Element jeweils auf einer neuen Zeile)

dargestellt. Siehe dazu die Selfhtml-Site.

CSS Styles einfügen

CSS-Anweisungen können auf 3 Arten einem HTML-Dokument zugeordnet werden:

  • Inline Styles, für ein HTML-Tag

  • Embedded Styles, für eine Seite

  • Linked Styles, CSS-Datei zu einer ganzen Site

CSS Selektoren

Einige Beispiele:

#single_box  {  }   
.menu_box    {  }   
.menu_box a  {  }   
.menu_box a:hover {  }

CSS, Überschreiben

Nachfolgende Deklarationen überschreiben vorhergehende.

CSS, Vererbung

Innere Elemente erben von äusseren Elementen, sind Teil der Äusseren.

Das CSS Box Modell

CSS Box Modell

Achtung: FireFox und IE benutzen unterschiedliche Boxdarstellungen (Box Model).

Standardisierung HTML, CSS

Siehe W3C Organisation.