Aus dem Kurs: CSS: Responsive Flexbox-Layouts für Profis
So erhalten Sie Zugriff auf diesen Kurs
Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 24.900 Kurse von Branchenfachleuten.
Was ist ein Holy-Grail-Layout? – Tutorial zu CSS
Aus dem Kurs: CSS: Responsive Flexbox-Layouts für Profis
Was ist ein Holy-Grail-Layout?
Im Webdesign gibt es ein Layout, das als Holy Grail, also als Heiliger Gral bezeichnet wird, weil es bis jetzt eigentlich fast ziemlich unmöglich war, dieses Layout tatsächlich zu bauen. Ein solches Layout sehen Sie hier. Es gibt einen durchgehenden Header über die volle Layoutbreite, ganz unten gibt es einen durchgehenden Footer über die volle Layoutbreite und im Inhaltsbereich gibt es mehrere Spalten, die unabhängig von ihrem Inhalt alle gleich hoch sind. Deswegen ist das ein Heiliger Gral, denn Spalten, die gleich hoch sind, das ist in CSS fast unmöglich und man müsste dazu entweder auf JavaScript oder auf wirklich kompliziertes CSS zurückgreifen. Wie das früher ging, das wird in diesem Artikel hier von 2006 geschildert "In Search of the Holy Grail" und entweder studieren Sie diesen Artikel und lernen das komplizierte CSS oder Sie machen es einfach mit Flexbox. Mit den Techniken aus den vorherigen Kapiteln können Sie ein vollfunktionierendes Holy-Grail-Layout erstellen, hier mit…
Üben mit Projektdateien
Laden Sie die Dateien herunter, die von den Trainer:innen verwendet werden. So können Sie mitlesen und durch Ansehen, Zuhören und Üben lernen.
Inhalt
-
-
-
-
-
-
(Gesperrt)
Was ist ein Holy-Grail-Layout?2 Min. 48 Sek.
-
(Gesperrt)
Holy Grail 1: HTML und Basisgestaltung4 Min. 58 Sek.
-
(Gesperrt)
Holy Grail 2: Layout gestalten per Flexbox5 Min. 55 Sek.
-
Holy Grail 3: Sidebar nach links verschieben3 Min. 36 Sek.
-
(Gesperrt)
Flexbox in Aktion: Sticky Footer3 Min. 37 Sek.
-
(Gesperrt)
-
-