Button UI Kit <br />body{<br /> background: #35393d;<br />}<br />.controls_ui{ <br /> width: 300px; <br /> margin: 40px auto;<br />}<br />.button{<br /> color: #0f1214;<br /> text-shadow:0 1px 0 #484f58;<br /> margin-bottom: 20px;<br /> margin-right: 5px;<br /> border:1px solid #202124;<br /> box-shadow: 0 1px 0 #616a74 inset,0 1px 5px #212528;<br /> background: -webkit-linear-gradient(top,#474d54,#2f363d);<br /> background: -moz-linear-gradient(top,#474d54,#2f363d);<br /> background: -ms-linear-gradient(top,#474d54,#2f363d);<br /> background: -o-linear-gradient(top,#474d54,#2f363d);<br /> background: linear-gradient(top,#474d54,#2f363d);<br />}<br />.button:nth-child(3n){<br /> margin-right: 35px;<br />}<br />.button:hover{<br /> background: -webkit-linear-gradient(top,#5b6167,#30373e);<br /> background: -moz-linear-gradient(top,#5b6167,#30373e);<br /> background: -ms-linear-gradient(top,#5b6167,#30373e);<br /> background: -o-linear-gradient(top,#5b6167,#30373e);<br /> background: linear-gradient(top,#5b6167,#30373e);<br />}<br />.button:active{<br /> box-shadow: 0 1px #484c50;<br /> background: -webkit-linear-gradient(top,#232930,#3c4249);<br /> background: -moz-linear-gradient(top,#232930,#3c4249);<br /> background: -ms-linear-gradient(top,#232930,#3c4249);<br /> background: -o-linear-gradient(top,#232930,#3c4249);<br /> background: linear-gradient(top,#232930,#3c4249); <br />}<br />.round,<br />.square{<br /> width: 30px;<br /> height: 30px;<br />}<br />.round,<br />.roundbig{<br /> border-radius:15px;<br />}<br />.square,<br />.squarebig{<br /> border-radius:5px;<br />}<br />.button:after{<br /> display: block;<br />}<br />.round:nth-of-type(1):after,<br />.square:nth-of-type(4):after{<br /> content: "\2716";<br />}<br />.round:nth-of-type(2):after,<br />.square:nth-of-type(5):after{<br /> content: "\2714";<br />}<br />.round:nth-of-type(3):after,<br />.square:nth-of-type(6):after{<br /> content: "\271a";<br />}<br />.round:nth-of-type(7):after,<br />.square:nth-of-type(10):after{<br /> content: "\2717";<br />}<br />.round:nth-of-type(8):after,<br />.square:nth-of-type(11):after{<br /> content: "\2713";<br />}<br />.round:nth-of-type(9):after,<br />.square:nth-of-type(12):after{<br /> content: "\271d";<br />}<br />.roundbig,<br />.squarebig{<br /> width: 80px;<br /> height: 30px;<br />}<br /> http://www.999jiujiu.com/ Button Button Button Button Button Button
