body{ background-color:#999; } .box{ padding:20px; margin:40px; background: #dddddd; background: -webkit-linear-gradient(top, #dddddd 0%,#cccccc 50%,#eeeeee 51%,#cccccc 100%); background: -moz-linear-gradient(top, #dddddd 0%, #cccccc 50%, #eeeeee 51%, #cccccc 100%); background: -ms-linear-gradient(top, #dddddd 0%,#cccccc 50%,#eeeeee 51%,#cccccc 100%); background: -o-linear-gradient(top, #dddddd 0%,#cccccc 50%,#eeeeee 51%,#cccccc 100%); background: linear-gradient(to bottom, #dddddd 0%,#cccccc 50%,#eeeeee 51%,#cccccc 100%); border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 1px solid #eee; border-top: 1px solid #ffffff; text-shadow: 1px 1px 1px #eee; -moz-box-shadow: 0 1px 3px black; -webkit-box-shadow: 0 1px 3px black; box-shadow: 0 1px 3px black; }
<div class="box"> よく有り気なグラデーション入れてみたり...ってこれはボタンに多いかな </div>