html （脸书，绿色，橙色，影子红，橙色）选择一个CSS样式和工具按钮

Posted 2021-05-11

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html （脸书，绿色，橙色，影子红，橙色）选择一个CSS样式和工具按钮相关的知识，希望对你有一定的参考价值。

.myButton { 
 -moz-box-shadow: 0px 1px 0px 0px #fff6af; 
 -webkit-box-shadow: 0px 1px 0px 0px #fff6af; 
 box-shadow: 0px 1px 0px 0px #fff6af; 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, 
#ffab23)); 
 background:-moz-linear-gradient(top, #ffec64 5%, #ffab23 100%); 
 background:-webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%); 
 background:-o-linear-gradient(top, #ffec64 5%, #ffab23 100%); 
 background:-ms-linear-gradient(top, #ffec64 5%, #ffab23 100%); 
 background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', 
endColorstr='#ffab23',GradientType=0); 
 background-color:#ffec64; 
 -moz-border-radius:6px; 
 -webkit-border-radius:6px; 
 border-radius:6px; 
 border:1px solid #ffaa22; 
 display:inline-block; 
 cursor:pointer; 
 color:#333333; 
 font-family:arial; 
 font-size:15px; 
 font-weight:bold; 
 padding:6px 24px; 
 text-decoration:none; 
 text-shadow:0px 1px 0px #ffee66; 
} 
.myButton:hover { 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, 
#ffec64)); 
 background:-moz-linear-gradient(top, #ffab23 5%, #ffec64 100%); 
 background:-webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%); 
 background:-o-linear-gradient(top, #ffab23 5%, #ffec64 100%); 
 background:-ms-linear-gradient(top, #ffab23 5%, #ffec64 100%); 
 background:linear-gradient(to bottom, #ffab23 5%, #ffec64 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', 
endColorstr='#ffec64',GradientType=0); 
 background-color:#ffab23; 
} 
.myButton:active { 
 position:relative; 
 top:1px; 
}

.myButton { 
 -moz-box-shadow: 3px 4px 0px 0px #8a2a21; 
 -webkit-box-shadow: 3px 4px 0px 0px #8a2a21; 
 box-shadow: 3px 4px 0px 0px #8a2a21; 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, 
#f24437)); 
 background:-moz-linear-gradient(top, #c62d1f 5%, #f24437 100%); 
 background:-webkit-linear-gradient(top, #c62d1f 5%, #f24437 100%); 
 background:-o-linear-gradient(top, #c62d1f 5%, #f24437 100%); 
 background:-ms-linear-gradient(top, #c62d1f 5%, #f24437 100%); 
 background:linear-gradient(to bottom, #c62d1f 5%, #f24437 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', 
endColorstr='#f24437',GradientType=0); 
 background-color:#c62d1f; 
 -moz-border-radius:18px; 
 -webkit-border-radius:18px; 
 border-radius:18px; 
 border:1px solid #d02718; 
 display:inline-block; 
 cursor:pointer; 
 color:#ffffff; 
 font-family:arial; 
 font-size:17px; 
 padding:7px 25px; 
 text-decoration:none; 
 text-shadow:0px 1px 0px #810e05; 
} 
.myButton:hover { 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24437), color-stop(1, 
#c62d1f)); 
 background:-moz-linear-gradient(top, #f24437 5%, #c62d1f 100%); 
 background:-webkit-linear-gradient(top, #f24437 5%, #c62d1f 100%); 
 background:-o-linear-gradient(top, #f24437 5%, #c62d1f 100%); 
 background:-ms-linear-gradient(top, #f24437 5%, #c62d1f 100%); 
 background:linear-gradient(to bottom, #f24437 5%, #c62d1f 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24437', 
endColorstr='#c62d1f',GradientType=0); 
 background-color:#f24437; 
} 
.myButton:active { 
 position:relative; 
 top:1px; 
}

.myButton { 
 -moz-box-shadow:inset 0px 1px 0px 0px #f9eca0; 
 -webkit-box-shadow:inset 0px 1px 0px 0px #f9eca0; 
 box-shadow:inset 0px 1px 0px 0px #f9eca0; 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f0c911), color-stop(1, 
#f2ab1e)); 
 background:-moz-linear-gradient(top, #f0c911 5%, #f2ab1e 100%); 
 background:-webkit-linear-gradient(top, #f0c911 5%, #f2ab1e 100%); 
 background:-o-linear-gradient(top, #f0c911 5%, #f2ab1e 100%); 
 background:-ms-linear-gradient(top, #f0c911 5%, #f2ab1e 100%); 
 background:linear-gradient(to bottom, #f0c911 5%, #f2ab1e 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0c911', 
endColorstr='#f2ab1e',GradientType=0); 
 background-color:#f0c911; 
 -moz-border-radius:42px; 
 -webkit-border-radius:42px; 
 border-radius:42px; 
 border:1px solid #e65f44; 
 display:inline-block; 
 cursor:pointer; 
 color:#ffffff; 
 font-family:arial; 
 font-size:20px; 
 font-weight:bold; 
 padding:8px 25px; 
 text-decoration:none; 
 text-shadow:0px 1px 0px #ded17c; 
} 
.myButton:hover { 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f2ab1e), color-stop(1, 
#f0c911)); 
 background:-moz-linear-gradient(top, #f2ab1e 5%, #f0c911 100%); 
 background:-webkit-linear-gradient(top, #f2ab1e 5%, #f0c911 100%); 
 background:-o-linear-gradient(top, #f2ab1e 5%, #f0c911 100%); 
 background:-ms-linear-gradient(top, #f2ab1e 5%, #f0c911 100%); 
 background:linear-gradient(to bottom, #f2ab1e 5%, #f0c911 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2ab1e', 
endColorstr='#f0c911',GradientType=0); 
 background-color:#f2ab1e; 
} 
.myButton:active { 
 position:relative; 
 top:1px; 
}

.myButton { 
 -moz-box-shadow:inset 0px 1px 0px 0px #3dc21b; 
 -webkit-box-shadow:inset 0px 1px 0px 0px #3dc21b; 
 box-shadow:inset 0px 1px 0px 0px #3dc21b; 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #44c767), color-stop(1, 
#5cbf2a)); 
 background:-moz-linear-gradient(top, #44c767 5%, #5cbf2a 100%); 
 background:-webkit-linear-gradient(top, #44c767 5%, #5cbf2a 100%); 
 background:-o-linear-gradient(top, #44c767 5%, #5cbf2a 100%); 
 background:-ms-linear-gradient(top, #44c767 5%, #5cbf2a 100%); 
 background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#44c767', 
endColorstr='#5cbf2a',GradientType=0); 
 background-color:#44c767; 
 -moz-border-radius:6px; 
 -webkit-border-radius:6px; 
 border-radius:6px; 
 border:1px solid #18ab29; 
 display:inline-block; 
 cursor:pointer; 
 color:#ffffff; 
 font-family:arial; 
 font-size:15px; 
 font-weight:bold; 
 padding:10px 24px; 
 text-decoration:none; 
 text-shadow:0px 1px 0px #2f6627; 
} 
.myButton:hover { 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cbf2a), color-stop(1, 
#44c767)); 
 background:-moz-linear-gradient(top, #5cbf2a 5%, #44c767 100%); 
 background:-webkit-linear-gradient(top, #5cbf2a 5%, #44c767 100%); 
 background:-o-linear-gradient(top, #5cbf2a 5%, #44c767 100%); 
 background:-ms-linear-gradient(top, #5cbf2a 5%, #44c767 100%); 
 background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cbf2a', 
endColorstr='#44c767',GradientType=0); 
 background-color:#5cbf2a; 
} 
.myButton:active { 
 position:relative; 
 top:1px; 
}

.myButton { 
 -moz-box-shadow:inset 0px 1px 0px 0px #7a8eb9; 
 -webkit-box-shadow:inset 0px 1px 0px 0px #7a8eb9; 
 box-shadow:inset 0px 1px 0px 0px #7a8eb9; 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #637aad), color-stop(1, 
#5972a7)); 
 background:-moz-linear-gradient(top, #637aad 5%, #5972a7 100%); 
 background:-webkit-linear-gradient(top, #637aad 5%, #5972a7 100%); 
 background:-o-linear-gradient(top, #637aad 5%, #5972a7 100%); 
 background:-ms-linear-gradient(top, #637aad 5%, #5972a7 100%); 
 background:linear-gradient(to bottom, #637aad 5%, #5972a7 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#637aad', 
endColorstr='#5972a7',GradientType=0); 
 background-color:#637aad; 
 border:1px solid #314179; 
 display:inline-block; 
 cursor:pointer; 
 color:#ffffff; 
 font-family:arial; 
 font-size:13px; 
 font-weight:bold; 
 padding:6px 12px; 
 text-decoration:none; 
} 
.myButton:hover { 
 background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5972a7), color-stop(1, 
#637aad)); 
 background:-moz-linear-gradient(top, #5972a7 5%, #637aad 100%); 
 background:-webkit-linear-gradient(top, #5972a7 5%, #637aad 100%); 
 background:-o-linear-gradient(top, #5972a7 5%, #637aad 100%); 
 background:-ms-linear-gradient(top, #5972a7 5%, #637aad 100%); 
 background:linear-gradient(to bottom, #5972a7 5%, #637aad 100%); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5972a7', 
endColorstr='#637aad',GradientType=0); 
 background-color:#5972a7; 
} 
.myButton:active { 
 position:relative; 
 top:1px; 
}

<a href="#" class="myButton">Click Here!</a>

以上是关于html （脸书，绿色，橙色，影子红，橙色）选择一个CSS样式和工具按钮的主要内容，如果未能解决你的问题，请参考以下文章

在PS中，怎么更改图片中的黄色改成绿色、蓝色、橙色啊？

橙色点而不是绿色点

pom变成红橙色

css 橙色到几乎红BG-button.css

WampServer,只能启动到橙色.怎么才能启动到绿色了。

我想知道如何阅读 galen 框架报告生成的图像映射以进行布局测试。橙色、绿色、红色的颜色是啥意思？