In diesem Kapitel werden wir einige grundlegende HTML-Beispiele zeigen.
Mach dir keine Sorge, wenn wir Tags verwenden, die du noch nie gesehen hast.
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 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>
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:
…
HTML Paragraphen sind mit dem <p>
-Tag definiert:
<p> Dies ist ein Paragraph. </p> <p> Dies ist ein weiterer Paragraph. </p>
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 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">
Hast du dir jemals eine Webseite angesehen und dich gefragt: „Wie haben die das gemacht?“
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.