不同的速度淡出

Question

我開始練習一些CSS3動畫。我在這裏有一些示例代碼：http://jsfiddle.net/chricholson/z7Bg6/67/

我想知道，在未懸停時如何爲動畫指定更長的持續時間。目前，當我懸停時，它會採用相同的時間和設置來應用樣式以將其刪除。我想設置它，以便在未懸停時，背景顏色花費較長時間（誇大爲2秒），以使背景顏色恢復正常，但仍然需要0.1s才能在懸停時消失。

Answer 1

這看起來可能與直覺相反，但實際上你會將更長的持續時間應用於常規選擇器代碼，並將更短的持續時間應用於：hover和：focus選擇器代碼。

你可以基本上想到正常的風格，因爲當非懸停/聚焦時會發生什麼。

看到此更新JSFiddle。