不错的CSS徽章 - 你能帮我个忙吗?

时间:2010-09-20 16:25:20

标签: css badge

我想在Stack Overflow上实现徽章。也许你可以给我一些不错的CSS代码?

4 个答案:

答案 0 :(得分:48)

推出全新的

Stack Overflow BadgeMaker 3000

它使Badges™

只需弹出一个名字,告诉它你希望你的闪亮新徽章是什么颜色,而且你已经准备好了!

浏览器支持:所有现代浏览器,包括IE7。 IE8及以下版本不支持圆角。功能

答案 1 :(得分:14)

也许你可以使用漂亮的Firebug并看看SO是如何做到的。

答案 2 :(得分:1)

你的意思是圆角?它使用CSS3圆角:

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

答案 3 :(得分:1)

或者您可以在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;}