Suche Tagcloud Kommentare RSS
Entehrte Spammergemeinde

Für die Neugierigen: Seit der Implementierung der Botquestion-Funktion in meinem CMS BeautifyWeb und damit auch diesem Blog ist kein einziger...
- Tobias
Youtube: You've Watched ...

Nach entsprechend harscher Kritik haben sich Viacom und Google darauf geeinigt, dass die zu übergebenden Datensätze nicht die registrierten...
- Tobias
css-petals.net Design geehrt

Glückwunsch, sehr verdient. Es ist wirklich schön geworden. Das das ganze minimalistischer ist finde ich sehr gut dadurch erhält man...
- Roger
trends   berlin   24c3   css   reviews   Überwachung   termine   kurioses   web-design   web2.0   politisch   linux   23c3   beautify the web   webstandards   deutschland   arbeit   ccc   tutorials   congress   usability   bcc   zensur   spaß am gerät   vorträge   portfolio   2007   2008   antispam   persönlich  

Stus Duales System

Feinste CSS-Hacks

Zweifarbige HeadingsWenn man vom Web-Design nicht leben muss, dann kann man die eigene Zeit in faszinierende Dinge stecken und die abgefahrensten Sachen damit machen. So auch Stu Nicholls von CSSplay. Niemand sonst im weiten www kann so verrückt-fantastische Dinge mit CSS anstellen.

Ein Meisterstück an CSS-Hacking sind z.B. zweifarbige Überschriften ohne doppelten Content, ohne Javascript oder sonstige Tricksereien. Dabei macht sich Stu das title-Tag zunutze: Er greift via dem content-Befehl auf den Inhalt des title-Tags zu & positioniert es absolut zur Überschrift, deren title-Tag genutzt wird.

Die line-height der Überschrift wird dabei halbiert und der Output des title-Tags auf den unteren 50% der line-height der Überschrift positioniert. Der Output des title-Tags kann seperat eingefärbt werden. Somit erschafft man zweifarbige Überschriften ohne Nachteile - abgesehen davon, dass dieser CSS-Hack natürlich nicht auf allen Browsern funktioniert.

Die simple Brillianz dieses Hacks ist der wirklich begeisternde Aspekt - Im Alltagsgeschäft Web-Design hat man einfach keine Muße, sich solch cleveren Lösungen zu überlegen.

Geschrieben am 16.10.2007

Zurück

0 Kommentare



Kommentar-Formular

Name:

E-mail oder URL:
(Optional)