Hypertext Markup Language (HTML)

Get Started. It's Free
or sign up with your email address
Hypertext Markup Language (HTML) by Mind Map: Hypertext Markup Language (HTML)

1. Struktur / Syntax

1.1. Projekt: mehrere Seiten als einzelne HTML-Dateien in Verzeichnisstruktur Verknüpfung über Links

1.1.1. relative Adressierung: Pfadangabe relativ zur Position der aktuellen Datei im Verzeichnisbaum; zwei Punkte (..), um ein verzeichnis nach oben zu wechseln

1.2. Einzelne Seite: <!doctype html> <html lang=de> <head></head> <body></body> </html>

1.2.1. Sprachangabe im Tag html

1.3. Tags: normalerweise <...> </...> (öffnend und schließend)

1.3.1. Markieren Gültigkeitsbereich eines Elements für Computer

1.3.2. Sonderzeichen teilweise nicht verfügbar

2. Cascading Style Sheets (CSS)

2.1. Generell Selektor { Eigenschaft: Wert; }

2.2. Beispiel Schriftgröße in Absätzen verändern: p { font-size: 1.5em; }

2.3. andere Eigenschaften: (Hintergrund-)Farbe, Größe, Rahmen, Abstände, Ausrichtung, Schriftart, Hintergrundbilder

2.4. muss in HTML-Datei eingebunden werden; normalerweise das gleiche CSS für verschiedene HTML-Dazteien

3. head Elemente: Informationen für den Browser

3.1. <title></title>: Titel der Seite

3.2. <meta>: Informationen über das Dokument

3.2.1. UTF-8

3.3. <link rel="stylesheet" href="Pfadangabe">

4. body Elemente: Text, der angezeigt wird

4.1. <p></p>: Absätze (paragraph)

4.2. <h1></h1>, etc.: Überschriften verschiedener Größe (headline)

4.3. <ol></ol> bzw. <ul></ul>: geordnete (ordered) und ungeordnete (unordered) Listen

4.3.1. <li></li>: einzelne Punkte der Liste

4.4. <table></table>: Tabelle

4.4.1. <tr></tr>: eine Tabellenzeile (table row)

4.4.2. <th></th>: Tabellenüberschrift (table header)

4.4.3. <td></td>: Tabelleninhalte (table data)

4.5. <a href="Pfadangabe">Linktext</a>: Links

4.6. <img src="Pfadangabe" alt="Name des Bildes">: Bilder