Für die Verwendung in meinen Webprojekten habe ich diese Webbuttons umgesetzt.
Die weitere Verwendung und Bearbeitung ist erlaubt und gewünscht.
Die Darstellung habe ich in folgenden Browsern erfolgreich getestet:
Firefox 3.6, Safari 4, Internet Explorer 7 & 8.
Beispieldarstellungen für unterschiedliche Einsatzmöglichkeiten, mit dem dazugehörigen HTML-Markup:
Standard Hervorgehoben fixe Breite Aktiviert Inaktiv
<a class="btn">Standard</a>
<a class="btn primary">Hervorgehoben</a>
<a class="btn" style="width:150px;">fixe Breite</a>
<a class="btn checked">Aktiviert</a>
<a class="btn disabled">Inaktiv</a>
<input type="submit" class="btn" value="Submit Button" />
<button class="btn">Button-Tag</button>
<button class="btn"><span class="icon left heart"></span>mit Icon</button>
<button class="btn">Icon rechts<span class="icon right heart"></span></button>
<button class="btn"><span class="icon heart"></span></button>
<a class="btn pill left checked">Links</a><a class="btn pill center">Mitte</a><a class="btn pill right">Rechts</a>
ZIP-Datei beinhaltet diese HTML-Seite, das Button-Stylesheet und die Bilddateien:
» style_button_v1-0.zip
Bei der Erstellung hab ich mich bei folgenden Seiten inspiriert:
Recreating the button, jQuery imageless buttons a la Google
Die Beispiel-Icons stammen aus dem freien Icon-Set Hamburg.
Erstellt von Reinhard Söllradl.
Letzte Änderung: Mai 2010