Archiv für das Schlagwort html

[CSS3] Die Pseudo-Klasse :target im Detail

12. April 2012 / 7.624 Aufrufe / keine Antwort bisher

Ich habe vor kurzem in diesem Artikel einige Pseudo-Elemente vorgestellt und auch Beispiele für den praktischen Einsatz aufgezeigt. Ein Element habe ich dabei bewusst ausgelassen, da es sich definitiv lohnt, es genauer vorzustellen: die Pseudo-Klasse :target. Wie der Name schon
Weiterlesen

[CSS3] WordPress-Banner mit Pseudoelementen

6. April 2012 / 5.581 Aufrufe / keine Antwort bisher

Ich habe vor kurzem auf einer Webseite ein hängendes Werbebanner mit verschieden angeordneten Buchstaben gesehen, welches als Bilddatei eingebunden wurde. Sah klasse aus und da habe ich mir gedacht, dass das auch per CSS3 – gänzlich ohne Grafikdateien – umgesetzt
Weiterlesen

[CSS3] Slideshow mit „keyframes“

22. Februar 2012 / 7.462 Aufrufe / keine Antwort bisher

Interessante Inhalte der eigenen Webseite auf interessante Art und Weise zu präsentieren ist wohl das Ziel eines jeden Webseitenbetreibers. Dem Besucher stechen dabei bewegte Bilder und Animationen natürlich besonders ins Auge. Mit keyframe-Animationen gibt es unzählige Möglichkeiten das Interesse des
Weiterlesen

[CSS3] Mach dir deine eigenen Tooltips

5. Februar 2012 / 7.318 Aufrufe / keine Antwort bisher

Jeder kennt sie, jeder mag sie. Sagen sie uns doch, was hinter eine Link zum Vorschein kommen wird oder welche Bedeutung ein Bild hat: Tooltips. Tooltips zeigen definierte Attribute eines Hyperlinks, eines Bildes etc. an, wenn wir mit der Maus
Weiterlesen

[CSS3] Pseudo-Spielchen

19. Januar 2012 / 5.353 Aufrufe / 2 Antworten

Genau genommen ist die Überschrift nicht ganz korrekt. Es geht es hier nicht in erster Linie um CSS3, denn viele der Pseudoelemente bzw. -klassen gab es schon mit CSS2 oder früher. Dennoch wird es im Zusammenspiel mit den Möglichkeiten, die
Weiterlesen

[CSS3] Spielereien mit „transform“

26. Oktober 2011 / 7.774 Aufrufe / 1 Antwort

Es ist schon beeindruckend welche Möglichkeiten CSS3 bietet. Wo wir früher ein Grafikprogramm bemühen mussten, können wir das gleiche Ergebnis heute mit reinem CSS Code erzeugen. Wie wäre es beispielsweise mit einen animierten Stern (keine Ahnung, wie man das Ding sonst
Weiterlesen

[CSS3] Transformieren Teil 2 mit „translate“ und „skew“

18. Oktober 2011 / 3.776 Aufrufe / 1 Antwort

Transformieren mittels „transform“ geht weiter. Im ersten Teil habe ich gezeigt, wie Objekte skaliert („scale“) und gedreht („rotate“) werden können. „Transform“ bietet aber noch mehr. Zeit für Teil 2 mit den Hauptdarstellern „translate“ (verschieben von Objekten) und „skew“ (verzerren von Objekten).

[CSS3] Eine animierte HTTP-Fehler-404 Seite

1. September 2011 / 7.415 Aufrufe / keine Antwort bisher

Habt ihr schon meine HTTP-Fehler-404 Seite gesehen? Ich hoffe nicht… Bisher habe ich eine WordPress 404-Fehlerseite genutzt, um die Besucher über einen nicht mehr funktionierenden Link zu informieren. Nun habe ich dafür eine separate HTML-Seite, losgelöst vom WordPress-Theme, angelegt. Und da
Weiterlesen

[olivergast.de] Design Version 2

23. August 2011 / 4.361 Aufrufe / 1 Antwort

Nachdem das bisherige Design meiner Internetseite nun etwa 1 Jahr auf dem Buckel hat, dachte ich mir es ist mal wieder Zeit für einen Tapetenwechsel. Ab heute ist das neue Design am Start; ich hoffe es gefällt euch. Was hat sich
Weiterlesen

[CSS3] Spiegeln mit „box-reflect“

19. August 2011 / 11.360 Aufrufe / 1 Antwort

In diesem Artikel habe ich gezeigt, wie mittels des Grafikallrounders Gimp Bilder und Texte gespiegelt werden können. Wer gespiegelte Bilder im Webdesign oder als Webinhalt einsetzen möchte, kann sich diesen Umweg zukünftig sparen, denn Webkit-Browser können mittels „box-reflect“ ebenfalls Bilder
Weiterlesen