Foto Tanja Volk

Die neuen HTML5-Elemente

Die Einführung von HTML5 erleichtert die Arbeit mit HTML-Dokumenten ungemein. Schon alleine der Head-Bereich ist jetzt so kurz und einfach, dass man ihn sich fast merken könnte... ;-) Die neuen HTML5-Elemente deuten darauf hin, welcher Inhalt sich darin befindet...

Schriften einbinden

Vielleicht möchten Sie sich nicht darauf verlassen, dass eine bestimmte Schriftart auf dem System des Webseitenbesuchers vorhanden ist oder Sie möchten zwecks Abwechslung eine besondere Schrift auf Ihrer Seite haben und nicht immer auf die altbekannten Standardschriften zurückgreifen. Dafür kann man jetzt externe Schriften (Webfonts) einbinden.

Arbeiten mit Flexboxen

Mit eine der besten neuen Errungenschaften von CSS3 ist eine neue Layouttechnik, und zwar das "Flexbox-Layoutmodul" auch Flexbox bzw. Flexboxen genannt. Durch diese wunderbare Technik müssen Layouts nicht mehr über umständliche Umwege mit floats umgesetzt werden. Floats werden jetzt nur noch benötigt, wenn Texte oder Bilder links oder rechts gefloatet werden sollen, dafür waren sie eigentlich ursprünglich auch nur gedacht.

Schatten mit Box-Shadow

Mit CSS3 kann man in windeseile einen Schatten für ein Element erstellen. Und das geht mit der Eigenschaft box-shadow...

Transitions

Transitions mit CSS3: Transitions dienen dazu, ganz ohne JavaScript etc. schöne und sanfte Übergänge zwischen CSS-Eigenschaften zu bekommen. Verschiedene Eigenschaften können mit einer Transition versehen werden. Zum Beispiel: Schriftgröße, Farbe,...

Arbeiten mit dem Modernizr

Bei der Entwicklung einer Webseite weiß man mittlerweile, dass nicht jeder Browser alle moderne Komponenten von CSS3 oder HTML5 unterstützt. Zudem gibt es unzählige Möglichkeiten welche Version eines Browsers der Webseitenbesucher gerade benutzt. Hier kommt der Modernizr ins Spiel...

3D-Transformationen

Effekte mit CSS3 - Teil 2: Die 3D-Transformationen Auch im dreidimensionalen Raum können Elemente transformiert werden. Hier kommt neben der X- und der Y-Achse eine weitere Dimension dazu und zwar die Y-Achse.

2D-Transformationen

Effekte mit CSS3 - Teil 1: Die 2D-Transformationen Mit CSS3 Transformationen können Elemente (Bilder, DIV-Container, Videos, …) im Browser transformiert, also verschoben, verzerrt, rotiert und skaliert werden.Transformationen erstellt man mit der Eigenschaft "transform".

Muster erzeugen

Ebenso wie ein Element in CSS3 mehrere Hintergrundbilder haben kann, können auch mehrere Farbverläufe miteinander kombiniert werden, sodass sich auf dieser Basis gekachelte oder gepunktete Muster für den Hintergrund erzeugen lassen können.

Radiale Farbverläufe mit CSS3

Analog zu den linearen Farverläufen gibt es radiale Farverläufe. Durch den Befehl "radial-gradient" werden ellipsen- bzw. kreisförmige Farbverläufe erzeugt.