2011-06-08 132 views
0

不工作,我有以下CSS3風格:按鈕風格在Safari

.shiny-btn { 
    cursor: pointer; 
    text-align:center; 
    width: 15em; 
    padding: .5em; 
    color: #ffffff; 
    text-shadow: 1px 1px 1px #000; 
    border: solid thin #882d13; 
    -webkit-border-radius: .7em; 
    -moz-border-radius: .7em; 
    border-radius: .7em; 
    -webkit-box-shadow: 2px 2px 3px #999; 
    box-shadow: 2px 2px 2px #bbb; 
    background-color: #ce401c; 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e9ede8), to(#ce401c),color-stop(0.4, #8c1b0b)); 
} 

.clicked { 
    background-color:gray; 
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.7) inset; 
} 

風格.shiny-btn作品,但"shiny-btn clicked"沒有在Safari 5.0.5工作。

你知道爲什麼嗎?

+0

你如何將這些類應用到你的按鈕? – BoltClock 2011-06-08 13:10:12

回答

1
background-image: -webkit-gradient(linear, left top, left bottom, from(#e9ede8), to(#ce401c),color-stop(0.4, #8c1b0b)); 

當你有class="shinybtn clicked"時,該行會被繼承。它覆蓋兩個clicked屬性。

.clicked { 
    background-color:gray; 
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.7) inset; 
    background-image:none; 
} 

這解決了它。