Termine:

• 19. April 2024, 10:00 Uhr – Raum 0.505

Worum geht es?

Heute gehen wir auf folgende Fragestellungen und Probleme ein:

• Wie könnte das Markup zur Aufgabe von letzter Woche aussehen?
• Wie schaffe ich eine saubere Projektstruktur?
• Was ist CSS und wie setze ich es ein?
• Wie binde ich CSS in ein HTML Dokument ein?
• Wie kontrolliere ich via CSS die visuellen Eigenschaften meiner Elemente?2
• Wie nutze ich Kaskadierung und Vererbung von CSS?
• Welche Selektoren stehen mir für die Auswahl von Elementen zur Verfügung?
• Wie nutze ich Klassen für die systematische Gestaltung der Elemente?
• Was steckt hinter dem Begriff Spezifität?
• Wie verwende ich spezifische Schriften?
• Welche Einheiten nutze ich für welche Zwecke?
• Kann ich das HSB Farbmodell nutzen?
• Wie formatiere und organisiere ich meinen CSS Code?

• Wie kann ich mit Hilfe von Custom Properties mein CSS vereinfachen?

• Wie erzeuge ich möglichst stabile/ fluide Eigenschaften?
• Wie setze ich das Konzept «Mobile First» um?
• Wie kann ich das Ganze noch etwas eleganter machen?

Was muss ich mitbringen?

Eigenen Computer mit Web-Editor und gutes semantisches Markup zu den Aufgaben aus dem Workshop „HTML Basics”. Außerdem sollten Sie sich bereits auf das Thema Cascading Stylesheets vorbereitet haben.

Was muss ich vorbereiten?

Bitte die Aufgaben aus der letzten Session lösen und hochladen. Außerdem bitte das CSS Crash Course Video anschauen.

Weiteres Material

• CSS Zen Garden
• CSS Naming Conventions
• Welche Browser sind derzeit im Markt?
• The Most Popular Browsers
• Frontendmentor
• DEV.TO
• https://cssreference.io
• https://css-tricks.com
• Warp Update Startercode
• Ergänzungen Asset Folder

Übungen

• CSS für die mobile Version der Website