需要幫助轉移CSS才能與Mozilla兼容

-2

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

}

此按鈕僅適用於Google Chrome瀏覽器，不適用於Firefox。需要幫助轉移CSS才能與Mozilla兼容

通過爲那些誰想要在這裏做一些嘗試的方法是的jsfiddle鏈接：http://jsfiddle.net/M5Bzn/

我已經試過被添加-moz-到所有的行但顯然沒有奏效的唯一的事情： P

來源

2012-09-16 mwong

你只需要用一個跨瀏覽器工具自己設計一個。 [ColorZilla的漸變編輯器]（http://www.colorzilla.com/gradient-editor/）可能會起作用。還有其他人。 –

還有別的辦法嗎？我的意思是我已經編碼了按鈕，我不必再重新按鈕。 – mwong

您不是針對瀏覽器，而是針對標準，而在您的CSS中只針對Chrome編碼。瞭解如何正確使用供應商前綴。 – Rob

如果你想專門針對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) 
     );

您可以在developer docs

0123閱讀更多關於線性漸變

注意：另外，根據Mozilla's Documentation,，在Gecko 13.0（Firefox 13.0/Thunderbird 13.0/SeaMonkey 2.10）中刪除了對前綴版本（-moz-border-radius）的支持。。如果你想支持舊版本的Firefox，你可以很容易地添加-moz-border-radius

來源

2012-09-16 03:12:17 cegfault

我不想專門針對它，但我希望它儘可能跨瀏覽器。 – mwong

在這種情況下，就像@Rob說的那樣，你不應該爲瀏覽器編碼，而應該爲標準編碼。沒有冒犯，但我建議你停下來，閱讀跨瀏覽器的CSS，然後重新開始。 – cegfault

需要幫助轉移CSS才能與Mozilla兼容

回答

相關問題