3. Basics
In diesem Kapitel werden wir einige grundlegende HTML-Beispiele zeigen.
Mach dir keine Sorge, wenn wir Tags verwenden, die du noch nie gesehen hast.
HTML Dokumente
Alle HTML-Dokumente müssen mit einer Dokumenttypdeklaration beginnen: <!DOCTYPE html>.
Das HTML-Dokument selbst beginnt mit <html> und endet mit </html>.
Der sichtbare Teil des HTML-Dokuments befindet sich zwischen <body> und </body>.
Die <!DOCTYPE> -Deklaration
Die <!DOCTYPE> -Deklaration stellt den Dokumenttyp dar und hilft Browsern, Websites korrekt anzuzeigen.
Es darf nur einmal oben auf der Seite erscheinen (vor allen anderen HTML-Tags), Groß- und Kleinschreibung ist dabei egal
Die <!DOCTYPE> -Deklaration für HTML5 lautet:
<!DOCTYPE html>
Überschriften
HTML-Überschriften werden mit den Tags <h1> bis <h6> definiert.
<h1> definiert die wichtigste und damit größte Überschrift. <h6> definiert die am wenigsten wichtige und damit kleinste Überschrift:
h1
h2
h3
…
Paragraphen
HTML Paragraphen sind mit dem <p> -Tag definiert:
<p> Dies ist ein Paragraph. </p> <p> Dies ist ein weiterer Paragraph. </p>
HTML-Links
HTML-Links werden mit dem <a> -Tag definiert:
<a href="https://cc-stadtfeld.de/wiki"> Dies ist ein Link </a>
Das Ziel des Links wird im href-Attribut angegeben.
Attribute werden verwendet, um zusätzliche Informationen zu HTML-Elementen bereitzustellen.
Weitere Informationen zu Attributen findest du in einem späteren Kapitel.
HTML-Bilder
HTML-Bilder werden mit dem <img> -Tag definiert.
Die Quelldatei (src), der alternative Text (alt), die Breite und die Höhe werden als Attribute bereitgestellt:
<img src="cc_logo.png" alt="CC Logo" width="300" height="100">
HTML-Quellcode anzeigen
Hast du dir jemals eine Webseite angesehen und dich gefragt: „Wie haben die das gemacht?“
HTML-Quellcode anzeigen
Klicke mit der rechten Maustaste auf eine HTML-Seite und wähle „Seitenquelle anzeigen“ (in Chrome) oder „Seitenquelltext anzeigen“ (in Edge) oder ähnliches in anderen Browsern. Dies öffnet ein Fenster mit dem HTML-Quellcode der Seite.