Kurs:Webdesign/CSS

Schnelldurchlauf

1. Laden Sie die ZIP-Datei css-uebungen.zip herunter. Packen Sie die Dateien so aus, dass ein Ordner rezepte entsteht.
2. Betrachten Sie die Webseiten, beginnend mit rezepte\index.html. Die Webseiten verwenden ein gemeinsames Stylesheet.
3. Verändern Sie das Stylesheet so. Erzeugen Sie folgende Formatierungen (sie brauchen nur 4 von den 6 wirklich machen und bekommen trotzdem alle punkte) siehe selfhtml (link neu!):
   1. Alle Absätze im Blocksatz
   2. In den Listen soll statt des "fetten Punktes" ein Bild als Listenpunkt verwendet werden (gif oder jpg ist egal)
   3. Schriftart für die Überschriften h1 bis h3 auf Verdana stellen (geben Sie nicht nur eine Schriftart an, sondern eine Liste von Schriften. Stellen Sie diese Liste so zusammen, dass auch auf Macs und UNIX-Maschienen eine ähnliche Schrift verwendet wird)
   4. Die erste Zeile aller Absätze soll eingezogen (englisch: indent) sein
   5. Links sollten nicht unterstrichen sein
   6. Links sollen gelb hinterlegt werden, wenn man mit der Maus drüberfährt (:hover)

Übung zum Formatieren von Text via CSS

So soll die Seite am Ende aussehen, wenn sie via CSS formatiert wurde

Bitte verwenden Sie die beigefügten Unterlagen!

Informationen zum Formatieren via CSS finden Sie im Wikibook [[[b:Handbuch_Webdesign:_CSS#CSS|HandbuchWebdesign]]]

Ausgangsmaterial

der Rohtext

Gardasee

Der Gardasee mit seinen hohen Bergen ist ein ideales Fahrrad-Revier

Man kann sich bei jeder Fahrt aussuchen, ob man auf flacher Strecke den See entlang fahren oder aber hoch in die Berge klettern möchte

Hier ein paar Eindrücke aus unserem letzten Urlaub

In San Zeno gibt es einen sehr schönen Brunnen, der dem heiligen Franz von Asisi geweiht ist

An vielen Stellen führt der Weg durch Olivenhaine mit teilweise uralten Bäumen

Fährt man etwas ins Hinterland, begegnet man kaum noch Touristen

Der Gardasee ist bequem von Deutschland und Österreich mit dem Zug zu erreichen! Es fahren stündlich Eurocity-Züge bis Verona – von dort sind es dann noch ca. 30km mit dem Fahrrad…

© Matthias Edler-Golla

Die verwendeten Bilder

diese wurden von Megolla fotografiert…

Datei:Aufmacher DSC00617.JPG

Aufmacherbild

Datei:DSC00657.jpg

Brunnen in San Zeno

Datei:DSC00573.jpg

Olivenhaine

Datei:DSC00578.jpg

Hinterland