溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關css中過渡transition屬性怎么用，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
一、transition(過渡)是指為了添加鼠標移到某種元素時，其可以從一種樣式轉變到另一種樣式。
二、實現方法：
1、指定樣式
.panel:target{
margin-top:0%;
background-color:#ffcb00;
}
2、調用樣式
.panel{
-webkit-transition:all.8sease-in-out;
-moz-transition:all.8sease-in-out;
-o-transition:all.8sease-in-out;
transition:all.8sease-in-out;
2.指定效果持續時間（時間默認為零，若不指定，則沒有效果）。
三、語法：transition：propertydurationtiming-functiondelay;
逐項分析每個屬性寫法:
1、transition-property（指定css屬性）:none(沒有屬性會獲得過渡效果);all（默認，所有屬性都將獲得過渡效果）;property（定義應用過渡效果的css屬性名稱列表以逗號分隔）;
2、transition-duration（規定完成過渡效果需要花費的時間）:time（規定完成過渡效果要花的時間，默認為0）；
3、transition-timing-function（指定切換效果的速度）:linear（規定以相同速度開始至結束的過渡效果）；ease（默認，規定慢速開始然后變快，然后慢速結束的過渡效果）；ease-in（規定以慢速開始的過渡效果）；ease-out（規定以慢速結束的過渡效果）；ease-in-out（規定以慢速開始和結束的過渡效果）；cubic-bezier（n,n,n,n）(在cubic-bezier函數中定義自己的值，可能的只是0-1之間的數值)
4、transition-delay（指定何時將開始切換效果）:time（指定秒或毫秒數之前要等待切換效果開始，默認值0）
關于“css中過渡transition屬性怎么用”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
