HTML Element - body
Das body-Element ist ein grundlegender Bestandteil jedes HTML-Dokuments und enthält den eigentlichen Dokumentinhalt.
Beispiel
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Eine Überschrift</h1>
<p>Ein Absatz mit einem Bild
<img src="images/kaffe-tasse.png" alt="eine Tasse Kaffee"></p>
</body>
</html>
Definition und Verwendung
In einem HTML-Dokument darf es nur ein body-Element geben.
Der body-Tag definiert den sichtbaren Hauptbereich eines HTML-Dokuments.
Das body-Element enthält den gesamten im Browser dargestellten Inhalt.
Das body-Element und sein Inhalt können mit CSS individuell gestaltet werden.
Attribute
Attribute erweitern Elemente um zusätzliche Eigenschaften oder Informationen und beeinflussen deren Bedeutung, Verhalten oder Darstellung. Sie bestehen in der Regel aus einem Attributnamen und einem zugehörigen Wert, wobei die zulässigen Attribute vom jeweiligen Element abhängen und teils allgemein, teils elementbezogen definiert sind.
Eine besondere Gruppe bilden die aria-*-Attribute, die zur Unterstützung der Barrierefreiheit zusätzliche Informationen für assistive Technologien bereitstellen.
Unterstützung von Global- und Event-Attributen
Das body-Tag unterstützt sowohl Global- als auch Event-Attribute in HTML.
Standardbrowser CSS
Webbrowser wenden auf viele Elemente vordefinierte CSS-Stile an, die eine grundlegende Struktur und Lesbarkeit sicherstellen. Umfang und Ausgestaltung dieser Standardstile können je nach Browser variieren, etwa in Bezug auf Abstände, Schriftgrößen oder die Darstellung einzelner Elemente.
body {
display: block;
margin: 8px;
}
body:focus {
outline: none;
}
Beispiel CSS Anpassung:
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #ffebcc;
}
</style>
</head>
<body>
<h1>Eine Überschrift</h1>
<p>Ein Absatz</p>
</body>
</html>
Beispiel CSS Anpassung:
<!DOCTYPE html>
<html>
<head>
<style>
body {
color: #ff9900;
}
</style>
</head>
<body>
<h1>Eine Überschrift</h1>
<p>Ein Absatz</p>
</body>
</html>
Beispiel CSS Anpassung:
Überschriften besitzen browserseitig definierte Standardgrößen und müssen daher gegebenenfalls separat im CSS angepasst werden.
<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: sans-serif;
font-size: 18px;
}
</style>
</head>
<body>
<h1>Eine Überschrift</h1>
<p>Ein Absatz</p>
</body>
</html>