4. Sitzung

Einleitung


Tabellen

Kapitel

00:00 - Ziel

01:33 - Tabellenkörper erstellen

02:19 - Zeilen und Zellen erstellen

04:03 - Tabelle mit Inhalten

05:34 - CSS Datei für Tabellen erstellen

06:16 - Tabelle zentrieren und kurzschreibweise für Abstände

08:09 - thead tbody und tr sind keine veränderbaren Elemente

08:59 - Stattdessen Styles für th und td

09:35 - Beispiel

10:11 - Zusammenfassung


Schatten

Kapitel

00:00 - Welche Arten von Schatten gibt es

00:40 - box-shadow

03:14 - Besonderheit vom box-shadow

04:07 - text-shadow

06:18 - drop-shadow

07:18 - Besonderheiten vom drop-shadow

08:07 - Verhalten vom drop-shadow

10:48 - Zusammenfassung


Cards

Kapitel

00:00 - Was sind Cards

01:00 - Container für Cards

02:18 - Inhalt meiner Cards

02:43 - Card Container stylen

03:54 - Cards mehr Form geben über Abstände

04:52 - Rahmen der Card stylen

06:40 - Weiteres Beispiel


Pseudo-Selektoren

Kapitel

00:00 - Was möchte ich erreichen

01:37 - first-child und not

05:42 - nth-child

08:18 - hover

10:06 - hover und focus


Animationen und Übergänge

Ressourcen

Easings - andere Abläufe von Übergängen
Alle Einstellungen zu Animationen

Kapitel

00:00 - Einen Übergang erstellen mit transition

02:11 - Mehrere Eigenschaften verändern ohne all

05:09 - Ablauf anpassen mit Easings

09:44 - Animationen definieren

12:22 - Animation auf ein Element anwenden

13:52 - Beispiel von verschiedenen Optionen die animation hat

18:54 - Verschieben von Inhalten mit transform und translate


Sitzungsaufgabe

Aufgaben

  • Cards und Tabellen verwenden (notfalls auf Beispielseiten)
  • Animationen und/oder Übergänge einbauen