Dies ist die Rohfassung der Übung.
Es sind folgende Aufgaben durchzuführen:
Aufgabenliste:
Einbinden der css-Datei jahreszeiten.css im Ordner Styles (alle 4 Jahreszeiten-Dateien)
Prüfe, ob alle 4 Jahreszeiten mit den Styles verbunden sind.
Verhindere die Anzeige der Aufzählungspunkte für die Liste der Navigations-Links
Verwende die Eiganschaft list-style-type:none für nav ul
Verhindere, dass die Links in nav ul unterstrichen werden mit text-decoration:none für nav ul a
Setze den Hintergrund background:lightgrey für nav ul li
Setze einen durchgezogenen Rahmen border:1px solid grey für nav ul li
Lege den Außenabstand margin:.2rem für nav ul li fest.
Lege den Innenabstand padding:.3rem für nav ul li fest.
Wenn so viele Menüpunkte vorhanden wären, dass es mehrzeilig wird,
wäre auch von Vorteil, die Zeilenhöhe line-height:2rem; für nav ul li zu setzen.
Erstelle für die Pseudoklasse hover von nav ul li einen weißen Hintergrund mit nav ul li:hover{background:white;}
Während des Hover-Effekts soll die Schriftfarbe der Links rot werden.
Deshalb setze color:red für nav ul li:hover a
Setze für alle Überschriften 1. Ordnung die Schriftfarbe auf beige,
den Text-Schatten mit text-shadow:.2rem .2rem brown; auf braun,
und lege die Schriftgröße mit font-size:3rem; für h1 fest.
Lege für sämtliche Images die Breite auf 10rem mit img{width:10rem;} fest.
Verändere die Schriftgröße für alle Absätze p mit p{font-size:1.6rem;} auf das 1,6-fache.
Damit der Text die Bilder umfließt, setze für die Images die Eigenschaft float auf left
mit float:left;
Damit der Text nicht so knapp am Bild klebt, setze für img einen Abstand mit margin-right:1rem;
Ersetze in der fruehling.html den ersten Menüpunkt für HOME durch eine Grafik mit, <a href="./index.html"><img src="../grafiken/home.jpg"></a>
Da diese Grafik viel zu groß angezeigt wird, setze die Breite auf 2rem mit nav ul a img{width:2rem;}
Führe die Ersetzung des HOME Links durch die Grafik auch in den 3 anderen Jahreszeiten durch.
Gib dem wrapper einen Box-Schatten durch die zusätzliche Eigenschaft box-shadow:0 0 5rem tan;