Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Gastautor 28. Juni 2006

CSS Zebratabelle, Layouts und Techniken

Kein Beitragsbild

Nein, die Zebra-Tabelle gehört nicht zum MSV Duisburg. Spielen kann man mit ihr trotz­dem. Das Anpassungswunder zeigt neue Möglichkeiten. Außerdem: Menüs, Schieberegler, Formulare, Layoutout-Techniken und ein schi­cker Bildwechsler.

Zebra Tabellen
Auch wenn Tabellen zum Layouten nicht mehr gebraucht wer­den, sie erfül­len noch immer einen nütz­li­chen Zweck. Eben des­halb ist die Entwicklung nicht ste­hen geblie­ben. Jop de Klein stellt uns sei­ne dyna­mi­sche Variante der “Zebra Tabelle” vor.

Screenshot

Anpassungswunder
Ein “Liquid-Design”, wel­ches sich stets der zur Verfügung ste­hen­den Breite des Browsers anpasst ist nicht in allen Fällen hin­rei­chend, es blei­ben immer wie­der Wünsche offen. Neue Ideen ope­rie­ren lis­ti­ger mit dem Problem. Zum Beispiel das CSS Drop Column Layout. Hier bre­chen qua­si die Spalten eines Layouts um. Je aus­la­den­der das Browserfenster ist, des­to mehr Spalten fül­len die Breite. Ist der zur Verfügung ste­hen­de Platz dage­gen schmal, ord­nen sich die Spalten unter­ein­an­der an.

Typisch CSS
Eine ansehn­li­che Bibliothek von Dynamic Drive. Enthalten sind 12 typi­sche CSS-Aufgaben, die vor allem das Menü betref­fen. Übersichtlich mit Beispielen, Images und schnell kopier­ten Quellcodes.

Screenshot

Tolle Formulare
Jeff Howden hasst mit­tel­mäs­si­ge Formulare und hat sich selbst an die Arbeit gemacht. Eine wirk­lich ansehn­li­che Vorführung, die als Studie gedacht ist.

Layout-Techniken
Auch Damien du Toit hat etwas für uns zusam­men­ge­stellt. Nämlich all das, was er zwi­schen “fixed” und “flu­id” noch an CSS-Techniken für das Seitenlayout fin­det konn­te. Als da wären: “Resolution depen­dent”, “Elastic”, “Jello”, “Progressive” und “Constrained”. Wem das zu unbe­kannt vor­kommt, die pas­sen­den Links sind gleich dabei.

CSS Schieberegler
Die Bastler unter den Lesern wer­den sich freu­en. Ein Art Schieberegler hat Peter Burkes kon­stru­iert. Und zwar ohne den Einsatz von Java, Javascript, Flash oder Grafiken. Gleich fünf ver­schie­de­ne Versionen gibt es davon. Es han­delt sich um rei­ne CSS-Container. Wie das wohl mög­lich ist…?

Screenshot

Bildwechsler
CSS gibt sich noch immer erfin­dungs­freu­dig und pro­biert sich aus. Hier ein ein­fa­cher, klei­ner und stan­dard­kon­for­mer Image Switcher, der unge­wöhn­li­cher­wei­se auf Listen beruht.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.