我有一个带css的css我调用了<a></a>
标签,并且css将该标签转换为按钮
我想要一个不是绿色的橙色按钮我不知道在css中做什么改变请帮助我。
以下是css:
.button {
width:138px;
height:33px;
font-size:13px;
font-weight:bold;
line-height:33px;
color:#fff;
text-shadow:0px 1px 0px rgba(0,0,0,.2);
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
-webkit-box-shadow:
inset 0px 1px 0px rgba(255,255,255,.5),
0px 1px 2px rgba(0,0,0,.3);
-moz-box-shadow:
inset 0px 1px 0px rgba(255,255,255,.5),
0px 1px 2px rgba(0,0,0,.3);
box-shadow:
inset 0px 1px 0px rgba(255,255,255,.5),
0px 1px 2px rgba(0,0,0,.3);
float:left;
}
.button img {
float:left;
width:33px;
height:33px;
}
.button.green {
background: -webkit-linear-gradient(top, rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
background: -moz-linear-gradient(top, rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
background: -o-linear-gradient(top, rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
background: -ms-linear-gradient(top, rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
background: linear-gradient(top, rgba(170,212,79,1) 0%,rgba(116,185,49,1) 90%,rgba(106,173,45,1) 95%,rgba(96,157,41,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aad44f', endColorstr='#609d29',GradientType=0 );
border:1px solid #5b8821;
margin:0 5px 0 35px;
}
@media only screen and (max-width: 767px) {
#modal {
width:284px;
height:156px;
padding:8px;
margin-left:-150px !important;
margin-top:-78px;
}
#heading {
width:284px;
height:28px;
line-height:28px;
font-size:0.688em;
}
#content {
width:284px;
height:128px;
}
#content p {
width:284px;
font-size:0.688em;
}
.button img {
width:23px;
height:23px;
}
.button {
width:108px;
height:23px;
line-height:23px;
font-size:0.688em;
}
.button.green {
margin:0 4px 0 28px !important;
}
.button.red {
margin:0 28px 0 4px !important;
}
}
我想将绿色按钮更改为橙色,请帮助我在css中执行此操作,将颜色从绿色变为橙色。
答案 0 :(得分:0)
更改.button_green
的样式.button.green
{
/* Note: This gradient may render differently in browsers that don't support the unprefixed gradient syntax */
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(top left, #FF9854 0%, #EFB55D 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(top left, #FF9854 0%, #EFB55D 100%);
/* Opera */
background-image: -o-linear-gradient(top left, #FF9854 0%, #EFB55D 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #FF9854), color-stop(1, #EFB55D));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(top left, #FF9854 0%, #EFB55D 100%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to bottom right, #FF9854 0%, #EFB55D 100%);
border:1px solid #5b8821;
margin:0 5px 0 35px;
}