Die besten Webtools für cross-browser kompatibles CSS!

 

CSS wird leider von vielen großen Browsern immer wieder anders interpretiert als man sich das wünscht. Nun bietet CSS3 eine tolle Möglichkeit um vormals selbst-erstellte Stile statt über Grafiken direkt über CSS umsetzen zu können. Das Problem: Um in allen Browsern einen einheitlichen Look seiner Styles zu gewährleisten, benötigt man das gewisse Know-How wie z.B. ein Browser X Schatten oder Box-Umrandungen interpretiert. Die Lösung: Man kann sich die hier vorgestellten Webtools und Generatoren mal genauer ansehen und nutzen.

Weiterer Vorteil: Gegenüber den Style selbst zu schreiben, kann man sich den Code schnell generieren lassen und spart entsprechend Zeit.

Ultimate CSS Gradient Generator

UltimateCSSGradientGenerator

Perfekte Farbverläufe wie aus Photoshop und das ohne Verwendung jeglicher selbst erstellter Grafiken – generiere hier deinen gewünschten Farbverlauf via CSS-Code. Die Oberfläche ist einfach und intuitiv und man kann mittels Colorpicker seinen individuellen Farbverlauf selbst erstellen. Jegliche Veränderung generiert die dafür benötigten Stylesheets neu und mit einem Klick auf „copy“ kannst du die Styles direkt in deine eigene CSS-Datei unkompliziert und einfach einfügen.

Hilfreich und extrem arbeitserleichternd: Der CSS-Code wird gleich für mehrere Browser generiert und gewährleistet so deinen einheitlichen Look im Firefox, Chrome und IE.

Klicke hier für den Ultimate CSS Gradient Generator…

 

CSS-Border Radius Generator

border-radius

Eigentlich ist ja ein Border-Radius schnell gemacht – zumindest für Firefox. Ob dieser aber dann im IE oder Chrome funktioniert, ist nicht wirklich garantiert. Abhilfe verspricht dieser einfache CSS Border-Radius Generator mit dem du die benötigten Styles auch für den Internet Explorer und Google Chrome schnell generieren kannst. Ein individueller Border-Radius nur an einer oder 3 Ecken ist ebenfalls möglich und schnell generiert. Fülle dazu einfach die Input-Felder an der gewünschten Ecke aus und fertig ist der generierte Style.

Klicke hier für den CSS Border Radius Generator…

 

Schatten in CSS – der Box-Shadow Generator

box-shadow-generator

Die Website scheint fertig und perfekt, aber irgendwie wird der eine Div-Container nicht so hervorgehoben, wie man das gerne hätte. Nun ja, vielleicht hilft hier ja ein leichter Schatten drumherum? Um diesen für alle Browser schnell generieren zu können, hilft hier der Box-Shadow Generator vom Webmaster Portal „Webmaster Elite“. Hier kannst du einfach mittels Colorpicker und Schiebereglern deinen individuellen Schatten erstellen und generieren lassen. Ist man fertig, kopiert man einfach die Styles aus dem unterem Textfeld heraus und fügt sie in seine eigene CSS-Datei ein. Einfacher geht es also wirklich nicht.

Hier geht es zum Box-Shadow Generator…

 

Tabellen in eigenem Style, passend zur Website – CSS Table Generator

css_table_generator

Das Design steht, alles ist perfekt – fehlen nur noch die Daten die ebenfalls schön im gleichen Style der Website dargestellt werden sollen. Kein Problem mit dem CSS Table Generator. Farben, Ränder, Zeilen – vom Tabellenhead bis zum Tabellen-foot – alles ist einstellbar und der Code wird angenehm direkt für dich generiert.

Hier geht es zum CSS Table Generator

 

CSS3 Button Generator

css3_button_generator

Wer sich fragt, wie man per CSS den perfekten Button gestalten kann, der könnte einen CSS3 Button Generator nutzen und sich den Style direkt selbst generieren lassen. Für faule und CSS-Newbies perfekt.

CSS3 Button Generator – Buttons direkt mit CSS3 ohne Grafiken gestalten

laith

laith

Laith ist Autor bei Augenschnapper, Inhaber der Webagentur qlixx.net und hauptberuflicher Mediendesigner.

Siehe auch...

1 Response

Schreibe einen Kommentar

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