Freizeitler » CSS

CSS: Vertikale Fly-Out-Navi mit Artikelvorschau (für WordPress)

Freizeitler — Sat, 29 Oct 2011 14:55:10 +0000

Die Navigation meines vorherigen WP-Themes beinhaltete eine interessante Lösung, um Kategorien als Menüpunkt zu nutzen und beim hovern die jeweils aktuellen Artikel anzuzeigen. Da ich dieses Theme nun ja nicht mehr nutze, möchte ich die Navigation hier einmal vorstellen. In diesem Artikel gibt es eine HTML/CSS-Datei sowie das PHP-Snippet für WordPress separat. Solide Grundlage Der [...]

Unicode Characters als Listenpunkte? Thierry Koblentz zeigt wie es geht

Freizeitler — Wed, 27 Apr 2011 22:09:56 +0000

Irgendwie habe ich darauf (zu) lange gewartet. Sollte mal ein anderes Zeichen als Listenpunkt verwendet werden als die übliche Palette zu bieten hat, musste ich immer auf eine Grafik zurück greifen. Neulich (um genau zu sein am 19. März 2011) rückte Thierry in einem Smashing Magazine Post mit einer Lösung raus. Ich habe es jetzt [...]

HTML5 und CSS3: Immer nur am Ball bleiben reicht nicht…

Freizeitler — Wed, 24 Nov 2010 07:25:09 +0000

…man muss auch mal spielen.Der Ansturm hat begonnen. In den letzten Monaten wird man mit neuen Experimenten und Erkenntnissen in Sachen HTML5 und CSS3 bombadiert. Die Entwicklung ist rasant – unzählige neue Veröffentlichungen, Ansätze und Ideen werden von der Netzgemeinde kontrovers diskutiert. Dieser Beitrag beschreibt keine Techniken, ich zeige vielmehr ein paar Experimente mit CSS3 und [...]

Kurz notiert: Platz 16 beim CSS Off von CSS-Tricks

Freizeitler — Mon, 15 Mar 2010 22:31:36 +0000

Als Chris Coyier am 10.02.2010 zum “The Great CSS Off” aufrief liess ich mich nicht lumpen. Immerhin konnte man zwei Fachbücher eigener Wahl sowie Ruhm und Ehre gewinnen. Obendrein diente das ganze noch einem guten Zweck, denn für jede Einsendung erklärte sich Chris bereit, 3$ an ein Haiti-Hilfsprogramm zu spenden. Die Aufgabe war es, aus [...]

CSS: F.I.M. (Fake Image Map) – eine CSS-Image-Map ohne Gif

Freizeitler — Sun, 20 Sep 2009 21:18:24 +0000

Ein Kommentar zu meinem letzten Artikel über die F.I.M. hat mich dazu gebracht, den Aufbau noch einmal gründlich zu überdenken und das Resultat ausgiebig zu testen. Somit kann ich jetzt eine echt gute Alternative vorstellen… Danke erstmal an Mat, der mich mit seinem Kommentar und Post auf den richtigen Weg gebracht hat und die Lösung [...]

CSS: Highlighting Boxes. Produkte hervorheben mit :hover

Freizeitler — Thu, 09 Jul 2009 20:23:53 +0000

In den unendlichen Tiefen des World-Wide-Webs bin ich neulich auf einen Artikel über Product Highlighting mittels CSS und Prototype.js gestossen. Interessante Geschichte, dachte ich mir, aber geht das auch ohne Javascript?Also fing ich an zu experimentieren… Highlighting Boxes. Klicken für Testcase. Moderne Webseiten (z. B. Shops oder Blogs) bedienen sich häufig auffälliger Objekte (Boxen, Badges [...]

CSS: Ein vertikales und/oder horizontales Dropdown-Menü

Freizeitler — Fri, 10 Apr 2009 08:57:22 +0000

Die Suche hat ein Ende! Hier gibt’s ein wirklich sehr leicht anzupassendes Dropdown-Menü ohne JavaScript. Es basiert auf einer herkömmlichen Liste mit Unterlistenpunkten und kann durch die Veränderung von nur zwei Attributen im Stylesheet in eine horizontale bzw. vertikale Navigation umgewandelt werden. Dieses Menü besticht, im Gegegnsatz zu vielen anderen, durch seine Einfachheit. Eine normale [...]

HTML: Was bedeutet eigentlich Semantik?

Freizeitler — Mon, 16 Mar 2009 18:35:14 +0000

Die Trendwende hat bereits stattgefunden. Das W3C und andere Institutionen haben jahrelang daran gearbeitet ein altes Bewusstsein in die Köpfe der Webdesigner zurück zu bringen – und sie haben es geschafft. Die Semantik ist wieder da! Aber was bedeutet Semantik für das Webdesign und wie wichtig ist sie wirklich? Dieser Artikel wird sich nicht mit [...]

HTML: form action. Mehr über Formulare in Aktion

Freizeitler — Sun, 15 Feb 2009 19:58:58 +0000

Formulare sind auf Internetseiten selbstverständlch. Wir benutzen sie fast täglich. Schauen wir uns doch mal so ein Formular genauer an. Wie wird es aufgebaut und wie sehen die einzelnen HTML-Komponenten aus? Hier gibt’s ein Demo. Obwohl HTML-Formulare zur Ausstattung einer Website gehören wird ihnen wenig Beachtung geschenkt. Sie zählen für viele User zum Standard und [...]

CSS: F.I.M. – Fake Image Map. Eine Alternative zur echten Image Map

Freizeitler — Mon, 09 Feb 2009 20:28:42 +0000

Alle, die sich schon einmal fragten, ob und wie man ein Background-Image verlinken kann ohne auf CSS3 warten zu müssen, sollten diesen Post einmal lesen. Die Antwort ist simpel, bulletproof und valide! Hier gibt’s einen Workaround… Hinweis: Diese Variante ist nicht mehr empfehlenswert! Eine bessere Alternative ohne .gif und somit ohne zusätzlichem Request findet ihr [...]