HTML-Übersicht

Alle HTML-Elemente: https://developer.mozilla.org/en-US/docs/Web/HTML/Element

1. Grundstruktur eines HTML-Dokuments

<!DOCTYPE html>
<html>
    <head>
        <!-- Metadaten -->
    </head>

    <body>
        <!-- Inhalt -->
    </body>
</html>

2. Aufbau eines HTML-Elements

<element attribut1="Wert1" attribut2="Wert2">
    I N H A L T
</element>

3. Attribute

id
class

4. Metadaten im `<head>`

<meta charset="UTF-8">
<title>
<link rel="stylesheet" href="style.css">

5. Die wichtigsten Block-Elemente

ohne Bedeutung
- <div>
Struktur
- <header>
- <main>
- <section>
- <article>
- <nav>
- <aside>
- <footer>
Überschriften
- <h1>, ..., <h6>
sonstige Bedeutung
- <p>
- <address>
Listen
- <ul> <li>
- <ol> <li>

6. Die wichtigsten Inline-Elemente

ohne Bedeutung
- <span>
mit Bedeutung
- <a>
- <br>
- <em>
- <strong>
- <s>
- <sub>
- <sup>

7. Tabellen

<table>
- <caption>
- <thead>
- <tbody>
  - <tr>
    - <th>
    - <td>
- <tfoot>

8. Bilder

<picture>
- <source>
- <img>

9. Formulare

<form>
- <fieldset>
  - <legend>
  - <input>
  - <label>
  - <button>
  - <select>
    - <option>