Html 需要帮助传输CSS以兼容Mozilla吗

此按钮仅在谷歌浏览器中有效，但在Firefox中无效

顺便说一句，对于那些想在这里做一些实验的人来说，JSFIDLE链接：

---

我尝试过的唯一一件事是在所有行中添加-moz-但显然不起作用：p

如果您想专门针对Mozilla，您可以将此添加到css中：

.greenbutton {
    font-family:"Helvetica";
       font-size:28px;
       font-weight:normal;
       line-height:130%;
       color:rgb(255,255,255);
       font-weight:300;
       height:100%;
       text-decoration:none;
       padding-left:40px;
       padding-right:40px;
       padding-top:3px;
       padding-bottom:3px;
       text-align: center;
       margin-top:25px;
       border-top-width:1px;
       border-top-color:#999999;
       border-top-style:solid;
       background-image: -webkit-gradient(
             linear,
             left bottom,
             left top,
             color-stop(0%, rgba(6,171,151,1)),
             color-stop(60%, rgba(6,171,151,1)),
             color-stop(61%, rgba(120,212,205,1)),
              color-stop(100%, rgba(120,212,205,1))
            );
       -webkit-border-radius:15px ;

}
.greenbuttonholder{
           width:140px;
           height:50px;
           padding-top:25px;
           position:relative;
           margin:auto;

}

你可以阅读更多关于线性渐变的文章

---

注意：对于border radius，根据“Gecko 13.0（Firefox 13.0/Thunderbird 13.0/SeaMonkey 2.10）中删除了对前缀版本（-moz border radius）的支持”。如果您想支持旧版本的firefox，您可以轻松添加-moz border radius，您只需使用跨浏览器工具自行设计一个即可。可能有用。还有其他的，还有别的办法吗？我的意思是，我已经对按钮进行了编码，我不必再重做按钮了。你的目标不是浏览器，你的目标是标准，在CSS中你只为Chrome编码。了解如何正确使用供应商前缀。我不想专门针对它，但我希望它尽可能跨浏览器。在这种情况下，就像@Rob所说的，你不应该为浏览器编码，而应该为标准编码。无意冒犯，但我建议您停止，阅读跨浏览器CSS，然后重新开始。

   border-radius: 15px;
   background: -moz-linear-gradient(
         top,
         rgba(120,212,205,1),
         rgba(120,212,205,1) 40%,
         rgba(6,171,151,1) 41%,
         rgba(6,171,151,1)
        );