Nizza distintivo CSS - può darmi una mano?

Question

Voglio realizzare badge come su Stack Overflow. Forse mi può dare qualche codice CSS bello?

Answer 1

Introducendo il nuovo

Stack Overflow BadgeMaker 3000

Rende Badge ™

Basta inserire in un nome, dillo che colore si desidera che il nuovo badge lucido per essere, e siete tutti insieme!

^{Supporto browser: Tutti i browser moderni, fino ae includendo IE7. angoli arrotondati non supportato in IE8 e al di sotto.}

Answer 2

Forse si può usare la bella Firebug e dare uno sguardo a come fa di esso.

Answer 3

Vuoi dire gli angoli arrotondati? Esso utilizza CSS3 angoli arrotondati:

border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;

Answer 4

In alternativa, è possibile eseguire una ricerca per 'distintivo' sul loro file CSS:

.badge,.badge-tag{color:#fff!important;background-color:#333;border:1px solid #333;margin:0 3px 3px 0;padding:0 6px 0 3px;display:inline-block;text-decoration:none;line-height:1.9;-moz-border-radius:6px;-webkit-border-radius:6px;}
.badge:hover,.badge-tag:hover{border:1px solid #555;background-color:#555;text-decoration:none;}
.badge-tag:hover{color:#fff!important;border:2px solid #555;}
.badge-tag{color:#333!important;border:2px solid #333;background-color:#eee;}