Eines der größten Probleme bei allen neuen CSS3-Eigenschaften ist, dass die meisten von ihnen über mehrere browserspezifische Implementierungen verfügen. Das heißt, wenn Sie einen einfachen Schatten wünschen, müssen Sie sich eine Menge Code merken, um ihn für so viele Browser wie möglich kompatibel zu machen.
Um Ihnen bei dieser Aufgabe zu helfen, haben einige unerschrockene Codierer kostenlose interaktive Tools entwickelt, die einfache Benutzeroberflächen bereitstellen, die den gesamten erforderlichen Code mit einem vollständig anpassbaren Endergebnis ausspucken. Im Folgenden finden Sie über 20 dieser CSS3-Generatoren.
CSS3 Generator
Auf jeden Fall eine der beliebtesten Optionen. Alle Effekte sind vollständig anpassbar und Sie können aus allen gängigen CSS3-Eigenschaften auswählen.
CSS3 Bitte
Eine weitere sehr beliebte Option, mit der Sie den Code so bearbeiten können, wie Sie ihn in einem Code-Editor sehen würden. Die Änderungen spiegeln sich in einer Grafik oben rechts wider.
CSS3 Klicken Sie auf Diagramm von Impressive Webs
Nicht sehr anpassbar (klicken Sie einfach auf den Code, um den Code anzuzeigen), aber wahrscheinlich der gründlichste auf der Liste, soweit die Anzahl der Effekte betroffen ist.
CSS-Tricks Button Maker
Ein ausgezeichneter kleiner Knopfmacher von Internet Wiz Chris Coyier. Verwenden Sie einfach die Schieberegler, um die Eigenschaften zu ändern.
Grenzradius
Eine der eleganteren Optionen zum Festlegen eines Grenzradius. Geben Sie einfach eine einzige Nummer ein und der Rest erledigt sich.
Font Squirrel @ Font-Face Kit Generator
Dies ist bei weitem mein Lieblingswerkzeug auf der Liste. Wenn Sie eine Schriftart hochladen, spucken Sie alles aus, was Sie zum Einbetten in eine Website benötigen. Dazu gehören HTML, CSS und verschiedene Dateiformate für Schriftarten. Sie möchten auf jeden Fall ein Lesezeichen setzen!
Westciv
Westciv bietet eine Reihe nützlicher CSS3-Generatoren, die kostenlos und einfach zu verwenden sind. Überprüfen Sie sie unten.
- CSS3-Farbverläufe
- CSS3 Textschatten
- CSS3-Umwandlungen
- CSS3-Textanschlag
- CSS3-Radialverläufe
- CSS3 Box Schatten
CSS3-Gradientengenerator
Verwenden Sie einige einfache Dropdown-Listen, und mithilfe eines Schiebereglers können Sie komplexe Verläufe erstellen.
Widgetpad CSS3 Generator
Ein anderes mit mehreren Eigenschaften und Effekten zur Auswahl.
Rahmenbild
Das Rahmenbild ist eine ziemlich komplizierte neue CSS3-Funktion. Finden Sie heraus, wie alles mit diesem Tool funktioniert.
Dry Icons Button Generator
Ein fantastischer Schaltflächengenerator mit vielen Optionen.
CSS-Ecken
Diese behandelt momentan Steigungen und abgerundete Ecken und verspricht bald weitere Optionen.
CSS3 Maker
Super Slick und einfach zu bedienen, behandelt eine Reihe von CSS-Tricks.
CSS3 Generator für abgerundete Ecken
Noch ein weiterer grundlegender Generator für abgerundete Ecken.
CSS3 Menu Generator
Dies ist eine vollständig herunterladbare Anwendung zum Erstellen komplexer CSS3-Menüs mit abgerundeten Ecken, Farbverläufen und mehr.
CSS3-Spaltengenerator
Einer der wenigen Spaltengeneratoren, die ich finden konnte (CSS3 Generator macht auch Spalten). Dieser ist nicht in englischer Sprache, ist aber immer noch leicht genug herauszufinden und der Code, den er ausspuckt, ist natürlich vollständig lesbar.
Schneller 3-Farben-CSS3-Gradientengenerator
Ein letzter CSS-Gradientengenerator, nur für den Fall, dass die oben genannten 10 nicht Ihrem Verlangen nach Gradienten genügen.
Fazit
Ich hoffe, dass die oben genannten Tools Ihnen helfen, ein CSS3-Master zu werden. Für noch mehr CSS3-Güte sehen Sie sich CSS-Infos und CSS3 Pie an. CSS-Infos enthält eine riesige Liste von CSS-Eigenschaften und die von Browsern unterstützten Eigenschaften. CSS3 Pie ist eine Ressource, um einen guten alten IE für die korrekte Anzeige von CSS3 zu verwenden.
Hinterlassen Sie unten einen Kommentar und lassen Sie uns wissen, was Ihre Lieblings-CSS-Generatoren sind und ob wir welche ausgelassen haben.