Magazin für digitale Arbeit & Kultur
Css

Mehr als nur runde Ecken: Testumgebungen für CSS3

admin
#css3 #playgrounds

CSS3 ist als kommender Standard schon sehr lange in der Diskussion. Die Unterstützung beschrankt sich derzeit auf alle modernen Browser (Mozilla, Opera, Safari, Chrome), also auf keinen der Internet Explorer. Im Sinne eines Progressive Enhancement kann man aber die große Verbreitung der modernen Browser nutzen und diesen mit einfachen Mitteln ein interessantes Layout verpassen, während der IE weiterhin eine funktionierende, aber featureärmere Seite geliefert bekommt.

Irritierend beim praktischen Einsatz ist oft, dass die meisten CSS3-Eigenschaften eine entsprechende Eigenschaft mit einem vendor-prefix für einen bestimmten Browsertypus kennen. Es kann dabei vorkommen, dass die browserspezifische Version anders geschrieben wird als in CSS3 vorgesehen. Deshalb ist es hilfreich, sich der zahlreichen Generatoren und Schnippsel-Seiten zu bedienen, die es mittlerweile im Netz gibt.

Eine der bekanntesten dürfte CSS3please sein. Die Popularität der Seite verwundert mich, da sie sehr schlecht lesbar ist und man sich die Bedienung im wesentlichen durch Raten und Testen erschliessen muss.

Der CSS-Gradient Generator ist auf die einfache Erstellung von Verläufen spezialisiert. Die Bedienung funktioniert intuitiv, die Seite ist klar und attraktiv. Man kann sogar eine IE-kompatible Ausgabe erwirken. Das Produkt der eigenen Bemühungen ist CSS-Code, den man in sein Projekt übernehmen kann. Hierbei kann man einen eigenen Klassennamen wählen und erklärende Kommentare zulassen oder unterdrücken.

Die unterschiedlichen Schreibweisen für runde Ecken kann man sich dagegen übrigens auf der Seite Border-Radius ausgeben lassen.

Richtig interessant ist allerdings der CSS3-Playground von Mike Plate. Dort kann man neben runden Ecken sowie Schatten für Boxen oder Text auch Transformationen austesten. Man bekommt ein direktes Feedback im Browser und eine sofortige Ausgabe des dafür zuständigen CSS-Codes.

Jens Grochtdreis setzt sich als Gründer der Webkrauts für moderne, standardkonforme Webseiten ein.

powered by
Logo idbeer

Über den Autor
Kommentare

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>