需要帮助传输 CSS 以兼容 Mozilla


.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;
}

此按钮仅适用于谷歌浏览器,但不适用于火狐浏览器。

顺便说一下,对于那些想在这里做一些实验的人来说,jsfiddle 链接是:http://jsfiddle.net/M5Bzn/

我唯一尝试的是在所有行中添加 -moz- 但这显然不起作用:P

如果你想专门针对 Mozilla,你可以把它添加到你的 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)
        );

您可以在开发人员文档中阅读有关线性渐变的更多信息

注意:另外,对于边框半径,根据Mozilla的文档,"对前缀版本(-moz-border-radius)的支持在Gecko 13.0(Firefox 13.0/Thunderbird 13.0/SeaMonkey 2.10)中删除。 如果你想支持旧版本的 Firefox,你可以很容易地添加 -moz-border-radius

最新更新