HTML Grundlegende Beispiele
Der erste Schritt bei der Erstellung einer Website besteht darin, zu lernen,
die Welt mit den Augen eines Internetnutzers zu sehen.
In diesem Kapitel zeigen wir einige grundlegende HTML-Beispiele.
Machen Sie sich keine Sorgen, wenn wir Tags verwenden, von denen Sie noch nichts wissen.
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 liegt zwischen <body> und </body>.
Beispiel
<!DOCTYPE html>
<html>
<body>
<h1>Meine erste Überschrift</h1>
<p>Mein erster Absatz.</p>
</body>
</html>
Versuch es selber »
Die <!DOCTYPE>-Deklaration
Die <!DOCTYPE>-Deklaration stellt den Dokumenttyp dar und hilft Browsern, Webseiten korrekt anzuzeigen.
Es darf nur einmal oben auf der Seite erscheinen (vor allen HTML-Tags).
Bei der <!DOCTYPE>-Deklaration wird die Groß-/Kleinschreibung nicht beachtet.
Die <!DOCTYPE>-Deklaration für HTML5 lautet:
<!DOCTYPE html>
HTML Überschriften
HTML-Überschriften werden mit den Tags <h1> bis <h6> definiert.
<h1> definiert die wichtigste Überschrift. <h6> definiert die unwichtigste Überschrift:
Beispiel
<h1>Das ist die Überschrift 1</h1>
<h2>Das ist die Überschrift 2</h2>
<h3>Das ist die Überschrift 3</h3>
Versuch es selber »
HTML Absätze
HTML-Absätze werden mit dem Tag <p> definiert:
HTML Links
HTML-Links werden mit dem Tag <a> definiert:
Das Ziel des Links wird im href-Attribut angegeben.
Attribute werden verwendet, um zusätzliche Informationen zu HTML-Elementen bereitzustellen.
Mehr über Attribute erfahren Sie in einem späteren Kapitel.
HTML Bilder
HTML-Bilder werden mit dem Tag ><img> definiert.
Die quelldatei (src), alternativer text (alt), width, und height werden als attribute bereitgestellt:
Wie kann ich die HTML-Quelle anzeigen?
Haben Sie jemals eine Webseite gesehen und sich gefragt: „Hey! Wie haben sie das gemacht?“
HTML-Quellcode anzeigen:
Klicken Sie mit der rechten Maustaste auf eine HTML-Seite und wählen Sie „Seitenquelle anzeigen“ (in Chrome) oder „Quelle anzeigen“ (in Edge) oder ähnliches in anderen Browsern. Dadurch wird ein Fenster geöffnet, das den HTML-Quellcode der Seite enthält.
Ein HTML-Element prüfen:
Klicken Sie mit der rechten Maustaste auf ein Element (oder einen leeren Bereich) und wählen Sie „Inspizieren“ oder „Element prüfen“, um zu sehen, woraus Elemente bestehen (Sie sehen sowohl HTML als auch CSS). Sie können den HTML- oder CSS-Code auch direkt im daraufhin geöffneten Bedienfeld „Elemente“ oder „Stile“ bearbeiten.
