在许多网站中都需要实用到按钮，一个好看实用的css按钮即可以给访问者以美感，又可以方便开发者。下面就是一个纯css按钮，需要的可以参考。
css代码
.div {display: inline-block;padding: .3em .5em;background-image: linear-gradient(#ddd, #bbb);border: 1px solid rgba(0,0,0,.2);border-radius: .3em;box-shadow: 0 1px white inset;text-align: center;text-shadow: 0 1px 1px black;color:white;font-weight: bold; } .div:active{box-shadow: .05em .1em .2em rgba(0,0,0,.6) inset;border-color: rgba(0,0,0,.3);background: #bbb; }
html代码
<div class="div">Button</div>
其他几种按钮
背景颜色
background-image: linear-gradient(#f5c153, #ea920d);
背景颜色
background-image: linear-gradient(#8eb349, #5f7c22);
背景颜色
background-image: linear-gradient(#fbb2d0, #e779aa);
