献上一组纯CSS3打造的冒泡按钮。采用背景图片做出冒泡的简单效果。按钮使用CSS3圆角，阴影技术等。先看看效果图：

CSS:

.button {
	cursor: pointer;
	font: 15px "微软雅黑", Arial, Helvetica, sans-serif;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	-moz-box-shadow: 0 0 3px #fff inset;
	-webkit-box-shadow: 0 0 3px #fff inset;
	box-shadow: 0 0 3px #fff inset;
	margin-left: 30px;
	background-image: url(bg.png);
	background-repeat: no-repeat;
	-webkit-transition: background-position 10s;
	-moz-transition: background-position 10s;
	transition: background-position 10s;
}
.button:active {
	bottom: -1px;
}
.button:hover {
	background-position: 0px -400px;
}
.blueBtn {
	padding: 15px 35px 15px 35px;
	outline: none;
	border: 1px solid #84acc3;
	color: #fff;
	background-color: #61c7fb;
}
.blueBtnsmall, .greenBtnsmall, .hBtnsmall, .RadiuBtnsamll {
	padding: 10px 25px 10px 25px !important;
	margin-top: 6px;
}
.greenBtn {
	padding: 15px 35px 15px 35px;
	outline: none;
	border: 1px solid #84acc3;
	color: #fff;
	background-color: #93d127;
	-webkit-transition: background-position 5s;
	-moz-transition: background-position 5s;
	transition: background-position 5s;
}
.hBtn {
	padding: 15px 35px 15px 35px;
	outline: none;
	border: 1px solid #ccc;
	color: #fff;
	background-color: #e9a032;
	-webkit-transition: background-position 5s;
	-moz-transition: background-position 5s;
	transition: background-position 5s;
}
.GroupBtn {
	padding: 15px 35px 15px 35px;
	outline: none;
	border: 1px solid #ccc;
	color: #fff;
	background-color: #65cefa;
	-webkit-transition: background-position 3s;
	-moz-transition: background-position 3s;
	transition: background-position 3s;
}
.GroupBtnLeft {
	-moz-border-radius: 8px 0 0 8px;
	-webkit-border-radius: 8px 0 0 8px;
	border-radius: 8px 0 0 8px;
}
.GroupBtnRight {
	-moz-border-radius: 0 8px 8px 0;
	-webkit-border-radius: 0 8px 8px 0;
	border-radius: 0 8px 8px 0;
	margin-left: -2px;
}
.RadiuBtn {
	padding: 12px 35px 12px 35px;
	outline: none;
	border: 1px solid #ccc;
	color: #fff;
	background-color: #f17337;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	-webkit-transition: background-position 3s;
	-moz-transition: background-position 3s;
	transition: background-position 3s;
}