多個轉換

Question

昨天我得到了我的問題解決了jquery，沒有正確加載。今天，我與另一個問題鬥爭：一個元素的兩個轉換。第一次轉換在頁面加載時開始：它淡入。當我不使用我的第二次轉換時，這個實際上起作用。我的第二次過渡必須在有人懸停在ul之上時開始。問題在於懸停轉換'覆蓋'淡入轉換。我的jsFiddle： http://jsfiddle.net/2cpX6/6/

在此先感謝。

Answer 1

具有相同名稱的CSS規則相互覆蓋，就像任何其他規則一樣。

試試這個：

transition: opacity 2s ease-in, color 0.3s ease-in-out; 

請注意，您只需要transition和-webkit-transition，因爲Firefox和Opera現在完全支持無前綴的版本，-ms-transition從來沒有存在過。

Answer 2

不能覆蓋相同的規則集，不能放置相同的CSS規則。這適用於一切。例如，如果您有：

span { 
    color: red; 
    color: green; 
} 

跨度爲綠色。這意味着您無法堆疊同一規則集的轉換規則。

您可以使用逗號創建多個單獨的轉換規則。

transition: opacity 2s ease-in, color .3s ease-in-out; 

http://jsfiddle.net/ExplosionPIlls/2cpX6/7/