這篇文章主要講解了“css中transition的說明和實例用法”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“css中transition的說明和實例用法”吧！
說明
1、transition允許在CSS屬性變化時給它添加一個過度的動畫效果。
通常情況下，CSS 屬性變化是立即生效的，新的屬性值在超級短的時間內替換掉舊的屬性值，然后瀏覽器重新繪制樣式內容（可能是 reflow 或者 repaint）。大部分情況下會感覺樣式變化突兀，而transition則可以添加順滑的一個變化效果。
2、transition的兼容性不算差，基本上移動設備都可以使用。
并且能做到漸進增強，支持的便有過渡效果，不支持的便是直接切換，所以可以放心使用。
實例
.content {
background: magenta;
transition: background 200ms ease-in 50ms;
}
.content:hover {
background: yellow;
transition: background 200ms ease-out 50ms;
}感謝各位的閱讀，以上就是“css中transition的說明和實例用法”的內容了，經過本文的學習后，相信大家對css中transition的說明和實例用法這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
