Weitere Infos
Sie lesen:
LB1 (2009)

Diese Website ist von 2009 und wird nicht mehr gepflegt. Die Informationen sind zum großen Teil also wirklich veraltet.
Aktuelle Infos finden Sie hier:
18.1 Layouts aus diesem Buch – Übersicht
Zunächst folgt nach dem Motto »Warum in die Ferne schweifen, wenn das Gute liegt so nah« ein kleiner Überblick über die in diesem Buch bisher erstellten Layouts, die Sie – mit Ausnahme des »Little Boxes«-Logo – gerne als Basis für eigene Websites verwenden können.
Die Webseiten zu den Abbildungen finden Sie im Beispielseiten-ZIP im Ordner zu diesem Kapitel.
Einspaltiges Layout mit horizontaler Navigation
Los geht es mit einem einspaltigen Layout, das in Kapitel 4 begonnen und in Kapitel 10 fertiggestellt wurde.
- Beispielseite "Einspaltiges Layout mit horizontaler Navigation"
(in neuem Browserfenster)
Diese Vorlage ist einfach zu erweitern, kann leicht farblich angepasst werden und ist als Grundlage für einfache, kleine Homepages gut geeignet.
Mehrspaltiges Layout mit absoluter Positionierung
In Kapitel 15 wird beschrieben, wie man mehrspaltige Layouts mit absoluter Positionierung erstellt. Als Grundlage für eigene Experimente finden Sie hier ein dreispaltiges Layout mit Kopf- und Fußzeile
und fester Breite, das auf den in Kapitel 15 beschriebenen Techniken basiert:
- Beispielseite "Mehrspaltiges Layout mit absoluter Positionierung"
(in neuem Browserfenster)
Dass es bei mehrspaltigen Layouts mit absoluter Positionierung keine durchgängige Fußzeile geben kann, fällt bei dieser Variante kaum auf.
Mehrspaltiges Layout mit float und margin (feste Breite)
In Kapitel 16 haben Sie dann gesehen, wie man mit float und margin mehrspaltige Layouts mit einer festen Breite erstellt. Das Beispiel sieht dem mit absoluter Positionierung gebauten Dreispalter optisch auf den ersten Blick sehr ähnlich und ist doch ganz anders gebaut:
- Beispielseite "Mehrspaltiges Layout mit float und margin (feste Breite)"
(in neuem Browserfenster)
Mehrspaltiges Layout mit float und margin (flexibel)
Mit derselben Technik haben Sie dann in Kapitel 17 ein flexibles Layout erstellt, das in der Abbildung zwar wiederum ähnlich aussieht, sich aber bei einer Änderung der Browserfenstergröße anders verhält:
- Beispielseite "Mehrspaltiges Layout mit float und margin (flexibel)"
(in neuem Browserfenster)