You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
2.9 KiB
CSS
30 lines
2.9 KiB
CSS
.u-btn{display:inline-block;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;padding:0 12px;height:28px;line-height:28px;border:1px solid #2d88bf;border-radius:5px;font-size:12px;letter-spacing:1px;text-align:center;vertical-align:middle;cursor:pointer;word-wrap:normal;white-space:nowrap;box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);text-shadow:0 -1px rgba(0,0,0,0.2);background:-webkit-gradient(linear,0% 0%,0% 100%,from(#6dbde4),to(#399dd8));background:-webkit-linear-gradient(#6dbde4,#399dd8);background:-moz-linear-gradient(#6dbde4,#399dd8);background:-ms-linear-gradient(#6dbde4,#399dd8);background:linear-gradient(#6dbde4,#399dd8);}
|
|
.u-btn,.u-btn:hover{color:#fff;text-decoration:none;}
|
|
.u-btn:hover,.u-btn:focus{background:#399dd8;}
|
|
.u-btn:active{box-shadow:inset 0 1px 4px rgba(0,0,0,0.2);}
|
|
.u-btn::-moz-focus-inner{padding:0;margin:0;border:0;}
|
|
.u-btn .btnsel{display:inline-block;vertical-align:middle;border-style:solid;border-width:4px 4px 0;border-color:rgba(255,255,255,0.8) transparent transparent;}
|
|
.u-btn:hover .btnsel,.u-btn:focus .btnsel{border-top-color:rgba(255,255,255,1);}
|
|
/* 较大 */
|
|
.u-btn-lg{padding:0 15px;height:36px;line-height:36px;font-size:18px;}
|
|
.u-btn-lg .btnsel{border-width:5px 5px 0;}
|
|
/* 较小 */
|
|
.u-btn-sm{padding:0 10px;height:22px;line-height:22px;}
|
|
/* 红色 */
|
|
.u-btn-c1{border-color:#9f161b;background:-webkit-gradient(linear,0% 0%,0% 100%,from(#ee232a),to(#cc1c23));background:-webkit-linear-gradient(#ee232a,#cc1c23);background:-moz-linear-gradient(#ee232a,#cc1c23);background:-ms-linear-gradient(#ee232a,#cc1c23);background:linear-gradient(#ee232a,#cc1c23);}
|
|
.u-btn-c1:hover,.u-btn-c1:focus{background:#cc1c23;}
|
|
/* 黄色 */
|
|
.u-btn-c2{border-color:#e1962d;background:-webkit-gradient(linear,0% 0%,0% 100%,from(#fbb149),to(#f8960a));background:-webkit-linear-gradient(#fbb149,#f8960a);background:-moz-linear-gradient(#fbb149,#f8960a);background:-ms-linear-gradient(#fbb149,#f8960a);background:linear-gradient(#fbb149,#f8960a);}
|
|
.u-btn-c2:hover,.u-btn-c2:focus{background:#f8960a;}
|
|
/* 绿色 */
|
|
.u-btn-c3{border-color:#52a552;background:-webkit-gradient(linear,0% 0%,0% 100%,from(#68c668),to(#50b150));background:-webkit-linear-gradient(#68c668,#50b150);background:-moz-linear-gradient(#68c668,#50b150);background:-ms-linear-gradient(#68c668,#50b150);background:linear-gradient(#68c668,#50b150);}
|
|
.u-btn-c3:hover,.u-btn-c3:focus{background:#50b150;}
|
|
/* 灰色 */
|
|
.u-btn-c4{border-color:#d0d0d0;text-shadow:0 1px rgba(255,255,255,0.8);background:-webkit-gradient(linear,0% 0%,0% 100%,from(#fefefe),to(#e7e7e7));background:-webkit-linear-gradient(#fefefe,#e7e7e7);background:-moz-linear-gradient(#fefefe,#e7e7e7);background:-ms-linear-gradient(#fefefe,#e7e7e7);background:linear-gradient(#fefefe,#e7e7e7);}
|
|
.u-btn-c4,.u-btn-c4:hover{color:#333;}
|
|
.u-btn-c4:hover,.u-btn-c4:focus{background:#e7e7e7;}
|
|
.u-btn-c4 .btnsel{border-top-color:rgba(0,0,0,0.6);}
|
|
.u-btn-c4:hover .btnsel,.u-btn-c4:focus .btnsel{border-top-color:rgba(0,0,0,1);}
|
|
|
|
|