html5 圆形按钮,利用:before和:after伪类制作CSS3 圆形按钮 - jerrylsxu

预览截图:

制作步骤:

一,

标签结构

下面代码中使用了CSS3无前缀脚本prefixfree.js,可以省去CSS3中前缀“-moz”、“-webkit”、“-o”、“-ms”

button

/*这里采用淡入效果试试*/

$(function(){

$(".bt").css("opacity","1");});

二,

标签结构

三，CSS代码

* {

padding: 0;

margin: 0;

}

/* 清除浮动 */

.clearfix:after {

content: "";

display: table;

clear: both;

}

html, body {

height: 100%;

}

body {

font-family: "Microsoft YaHei";

background: #E1E1E1;

font-weight: 300;

font-size: 15px;

color: #333;

overflow: hidden;

}

a {