為什麼我的懸停選單背景轉換不順暢？

懸停選單背景的過渡效果

問題：

儘管使用CSS過渡，但選單項目的背景顏色懸停時不會平滑變化。以下是相關的 CSS：

#content #nav a:hover {
    color: black;
    background-color: #AD310B;
    -moz-transition: all 1s ease-in;
    -webkit-transition: all 1s ease-in;
    -o-transition: all 1s ease-in;
    transition: all 1s ease-in;
}

答案：

瀏覽器支援對於過渡正常運作至關重要。截至撰寫本文時，以下版本支援轉換：

• Safari
• Chrome
• Firefox
• Opera
Inter🎜>Inter

要實現所需的淡入淡出效果，請考慮以下事項CSS：

a {
    background-color: #FF0;
}

a:hover {
    background-color: #AD310B;
    -webkit-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

這可確保背景顏色過渡在支援的瀏覽器中工作，在將滑鼠懸停在選單連結上時創建平滑的淡入淡出效果：

以上是為什麼我的懸停選單背景轉換不順暢？的詳細內容。更多資訊請關注PHP中文網其他相關文章！