HTML5-Elemente zur Seitenstrukturierung

Gehen Sie davon aus, dass Sie später einen Webauftritt zum Thema "Äpfel" bauen werden. In der Abbildung ist die zugehörige Seitenstruktur dargestellt.

Hinterlegen Sie in einer HTML-Datei die notwendigen HTML-Elemente. Ihre Lösung sollte zumindest die folgenden Bereiche der dargestellten Seite umfassen:

• einen Kopfbereich mit der Überschrift der Seite und drei Einträgen in der Navigationsleiste:
  • Überschrift: "Das ist ein Webauftritt zum Thema Äpfel"
  • Navigationspunkte: Beschreibung, Geschichte der Äpfel, Anbaugebiete. Die Navigationspunkte können als Elemente einer unsortierten Liste hinterlegt werden.
• einen linken Seitenbereich mit einer Aufzählung der Apfelsorten Boskop, Jonagold, Süßapfel,
• einen Hauptbereich, in dem auch ein längerer Text über Äpfel stehen kann,
• einen rechten Seitenbereich mit Werbebannern (hier: Apfelbildern),
• einen Fußbereich mit dem Copyright, Impressum und Kontaktinformationen.

Färben Sie den Hintergrund der HTML5-Elemente Ihrer Seite nach folgenden Angaben ein. Überprüfen Sie, ob Ihre Seite wie in der Abbildung aussieht:

header {
    background-color:#516C7F;
    padding: 5px;
}
nav {
    background-color:#A2D8FF;
}
aside {
    background-color:#A2D8FF;
}
footer {
    background-color:#516C7F;
}
main {
    background-color:#DEF;
}