P 1.3 Grundlagen CSS
In dieser Aufgabe wird die Portfolio-Website aus der Aufgabe aus dem Unterkapitel P 1.2 mit CSS ergänzt, um verschiedene Gestaltungsaspekte zu realisieren.
Erstellen Sie für diese Aufgabe wiederum einen neuen Unterordner (z.B. /Aufgabe-1.3) in Ihrem bestehenden GIT-Repository und erstellen dort eine Kopie Ihrer Portfolio-Webseite aus der vorherigen Aufgabe, an dem Sie nun weiterarbeiten werden.
Gestalten Sie ihre Webseite nach freien Stücken, beachten Sie dabei aber diese Anmerkungen! Versuchen Sie, ihr Design möglichst ansprechend zu gestalten. Als mögliche Vorlage können Sie diese Designs hinzuziehen (dies ist nur ein Vorschlag, Sie können ebenso ein eigenes Design entwickeln solange es den Anmerkungen folgt).
Scheuen Sie sich nicht vor strukturellen Änderungen ihres HTML Codes, um das Design besser umsetzen zu können.
HTML und CSS müssen eng zusammenarbeiten um das gewünschte Ergebnis einfach und effizient zu erreichen.
Das Grafikelement für den geforderten Hintergrund finden sie hier.
(*) Beachten Sie zusätzlich folgende Details:
- verwenden Sie zur Umsetzung des CSS ein extern eingebundenes Stylesheet (kein inline oder style-Element)
- jeder der drei Haupt-Selektoren (Element, ID, Klasse) soll mindestens zweimal vorkommen
- das Box-Modell soll mindestens einmal angewandt werden
Es bietet sich wahrscheinlich an, für alle drei Seiten die selbe Stylesheetdatei zu verwenden, dies ist aber kein muss (denn wie immer beim Programmieren gilt: wer Code kopiert, macht irgendwas falsch).
Achten Sie auch hier weiterhin auf die Konformität mit den Regeln des W3C und nutzen Sie ggf. den Validator.