# HTML body: Das HTML-Element für darstellbare Inhalte Im HTML-``-Element sind sämtliche sichtbaren Inhalte eines HTML-Dokuments enthalten. Pro Dokument kann nur ein einziger <body>-Bereich existieren. ## Was ist das HTML-``-Tag und wofür wird es genutzt? HTML <body> is ein HTML-Element, mit dessen Hilfe Inhalte eines Dokuments dargestellt werden. Sämtliche **sichtbaren Inhalte** wie Headlines, Textblöcke, Bilder, Tabellen, Hyperlinks, Listen sowie weitere mögliche Elemente werden innerhalb dieses HTML-Tags hinterlegt. In jedem Dokument kann es nur **einen einzigen HTML <body>** geben. Dieser befindet sich immer unter dem Bereich `` und über dem HTML footer. Das ``-Tag unterstützt alle globalen HTML-Attribute. ## HTML ``: Syntax und Funktionsweise Bevor wir Ihnen die Funktionsweise von HTML `` anhand einiger einfacher Beispiele zeigen, lohnt sich ein Blick auf die grundsätzliche Syntax des Elements. Diese sieht wie folgt aus: ```html Hier werden sämtliche sichtbaren Inhalte der Website hinterlegt. ``` Nur Inhalte, die zwischen dem einleitenden (``) und dem schließenden (``) Tag stehen, werden später auf der betreffenden Webseite angezeigt. ## Beispiele für die Nutzung von HTML `` In den nachfolgenden Beispielen sehen Sie, wie das HTML-``-Tag in der Praxis eingesetzt wird. ### HTML-Dokument mit simplem ``-Element Zunächst erstellen wir ein einfaches HTML-Dokument mit einer **Headline, einem Textabschnitt und einem Bild**, die alle innerhalb des Körpers hinterlegt werden. Dies ist der entsprechende Code: ```html HTML body in einem Dokument

Dies ist Ihre Headline

Hier steht der Inhalt Ihrer Website.

``` ### Eine Navigationsleiste mit href anlegen Im folgenden Beispiel sehen Sie, wie Sie mit dem HTML-``-Tag und dem Attribut href eine Navigationsleiste für Ihre Website anlegen. Dies ist der passende Code: ```html Website mit einer Navigationsleiste

Home

About

Kontakt

``` ### Video einbinden über das HTML-``-Tag Auch wenn Sie ein Video auf Ihrer Website einbinden möchten, ist der ``-Bereich der richtige (und einzig mögliche) Platz dafür. Dies ist ein beispielhafter Code für die Einbindung: ```html Website mit einem Video

``` ### Design ändern via HTML-``-Tag Mit Hilfe von CSS können Sie den ``-Bereich auch dazu verwenden, das Design Ihrer Webinhalte anzupassen. Wie das funktioniert, sehen Sie im folgenden Beispiel: ```html HTML body mit optischen Anpassungen

Hier steht Ihre Headline

Hier steht der Inhalt Ihrer Website.

``` ### Hintergründe anpassen im HTML `` Wenn Sie mit CSS lediglich Ihren [HTML Background](https://www.ionos.com/de-ch/digitalguide/websites/web-entwicklung/html-backgrounds/) ändern möchten, passiert dies ebenfalls im HTML ``. Hier sehen Sie, wie Sie die Hintergrundfarbe festlegen: ```html HTML body mit neuer Hintergrundfarbe

Hier steht Ihre Headline

Besuchen Sie Beispielseite.com!

``` Möchten Sie stattdessen ein Bild einfügen, ist dies der passende Code: ```html HTML body mit neuem Hintergrundbild

Hier steht Ihre Headline

Besuchen Sie Beispielseite.com!

``` This is a markdown version of: [https://www.ionos.com/de-ch/digitalguide/websites/web-entwicklung/html-body/](https://www.ionos.com/de-ch/digitalguide/websites/web-entwicklung/html-body/) for AI/LLM consumption.