Verschachtelung und Verwandtschaftsverhältnisse

Schauen wir uns die Seite an, die wir bisher gebaut haben:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Meine erste Seite</title>
	</head>
	<body>
	</body>
</html>

Manche Elemente stehen in anderen Elementen: head und body stehen in html, und meta und title stehen in head. Denk daran, dass der Inhalt eines Elements aus weiteren Elementen bestehen kann. Wenn wir ein Element in ein anderes setzen, sagen wir, dass wir es verschachteln.

Um zu beschreiben, wie verschachtelte Elemente zueinander stehen, leihen wir uns Wörter aus der Familie:

• Ein Elternelement ist das Element, in dem ein anderes Element direkt steht. html ist das Elternelement von head und body.
• Ein Kindelement ist ein Element, das direkt in einem anderen Element steht. title ist ein Kindelement von head.
• Geschwister sind Elemente mit demselben Elternelement. head und body sind Geschwister, und ebenso meta und title.

Geben wir jetzt dem body ein paar Kinder, damit auf unserer Seite endlich etwas erscheint. Neben der Überschrift h1 verwenden wir das Element p, das für Absatz steht (englisch paragraph). Absätze schauen wir uns in der nächsten Lektion genauer an.