CSS3過渡動畫 transition:all與transition區別

先寫一個樣式:

	<style>
		div{
		    width: 200px;
		    height: 200px;
		    margin: 100px auto;
		    background-color: #336699;
		    
		    /*transition:width 1s;*/
		    transition:all 1s;
		    /*transition: height 1s;*/
		}
		div:hover{
		    width: 300px;
		    height: 400px;
		}
	</style>

這裏transition:all 1s 與transition:1s 是相同效果的,也就是說帶不帶all都會出現一樣的效果,默認就是寬高會同時過渡。

我認爲transition帶不帶all區別就是:transition:width|height。如果過度動畫這裏是transition:width 1s;則鼠標滑過div的寬會有1秒的動畫,而高會立刻撐大爲400像素,沒有過渡時間。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章