Archiv der Kategorie: CSS3

Tile design: Same sized columns with css flex and grid combo

It sounds so incedibly simple: you just want a layout with a (variable) number of boxes like the tiles in your bathroom, but without the mortar: This requirement comes in regularly if you have to show categories in a nice … Weiterlesen

Veröffentlicht unter CSS3, HTML5 | Hinterlasse einen Kommentar

Endlich: der CSS backdrop-filter

Der Backdrop-Filter bringt endlich wieder frischen Schwungs ins Webdesign. Das aktuelle Flat-Design lässt wenig Platz für Schnörkel und Schatten, doch dank des backdrop-filters können wir nun wieder etwas kreativer werden. Mit den aktuellen Browsergenerationen wird dieses tolle Feature nun sowohl … Weiterlesen

Veröffentlicht unter CSS3 | Verschlagwortet mit , , , | Hinterlasse einen Kommentar

Accordion Boxen mit CSS3

Es gibt dank CSS3 einen fast schon unfassbar einfachen Weg, um dynamisch animierte Accordion Menus bzw. Boxen zu erstellen, die beim Anklicken des Titels sich gemächlich (natürlich nach genauer Vorgabe des Schöpfers) auseinanderfalten. Nachfolgend dazu ein Beispiel:
Veröffentlicht unter CSS3 | Verschlagwortet mit , , | 5 Kommentare

Box-Shadow Generator

box-shadow CSS 3 code generator Generieren Sie schnell und einfach Code für box-shadow Arbeiten Sie mit dem gesamten Code dieses CSS3 Code Generators online auf Codepen/Montego Box-Shadow Parameter - + Offset X - + Offset Y - + Blur - … Weiterlesen
Veröffentlicht unter CSS3 | Verschlagwortet mit , , , | Hinterlasse einen Kommentar

Box-Shadow in CSS3

Mit CSS3 sind die Zeiten vorbei, als Schattenwurf dem Programmierer den Angstschweißt auf die Stirn getrieben hat. Jede erdenkliche Form von Schatten ist mit dem box-shadow möglich, wenn man nur weiß, wie. Vom Schlagschatten bis hin zu feinen und diffusen, … Weiterlesen

Veröffentlicht unter CSS3 | Verschlagwortet mit , | Hinterlasse einen Kommentar

Farbverläufe (Gradients) mit CSS3

Farbverläufe machen die Welt schöner. Zumindest, wenn ein feinfühliger Designer damit hantiert und keine Regenbogenleuchthintergründe entstehen. Gradienten eignen sich für eine Vielzahl von Einsatzmöglichkeiten und schaffen Realismus, auch ohne Grafiken verwenden zu müssen. In der „echten“ Welt gibt es durch … Weiterlesen

Veröffentlicht unter CSS3 | 1 Kommentar

10 praktische CSS3 DIV Boxen Designs

Gutes Design lebt von den Details. Schöne Headerbilder sind toll, aber gefällige Strukturierung gerade auch des Contents erst macht den Unterschied zwischen einer amateurhaften und einer professionellen Website aus. Wir stellen hier eine Reihe von Boxen vor, die gänzlich ohne … Weiterlesen

Veröffentlicht unter CSS3 | Verschlagwortet mit , , , , , | 6 Kommentare

CSS3 Transitions: Texte transformieren mit ’scale‘

CSS3 bietet etwas, das bisher nur mit JavaScript möglich war: Animation. Bisher musste eine Animation, also eine graduelle Änderung von Eigenschaften über einen festgelegten Zeitraum, relativ mühsam per JavaScript programmiert werden. Mit CSS3 gibt es jetzt die einfache und elegante … Weiterlesen

Veröffentlicht unter CSS3 | Verschlagwortet mit , , , , , | 1 Kommentar

TrueType Fonts und Text-Transformation mit rotate

Spektakuläre Effekte mit CSS3 dank @font-face und transform:rotate Weiterlesen

Veröffentlicht unter CSS3 | Verschlagwortet mit , , , , , , , , , | 1 Kommentar

Border-Radius interaktives Tool

Ein sehr anschaulisches Tool liefert – das verwundert sehr – Microsoft zur Demonstration der border-radius-Attribute in CSS3: http://ie.microsoft.com/testdrive/HTML5/01BorderRadius/Default.html Und hier der Quellcode der Seiten zur einfachen Referenz:

Veröffentlicht unter CSS3 | Verschlagwortet mit , , , , , | 1 Kommentar