CSS3:transition屬性
transition: 要過渡的屬性 花費時間 運動曲線 何時開始;
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>過渡動畫</title>
<style>
div {
width: 400px;
height: 100px;
background-color: pink;
/*transition: 要過渡的屬性 花費時間 運動曲線 何時開始;*/
/*如果有多組屬性,用逗號隔開*/
/*transition: width 1s ease 0s, height 1s ease 0s, background-color 1s ease 0s;*/
transition: all 1s; /*簡寫,所有屬性都有過渡變化效果*/
}
div:hover {
width: 800px;
height: 200px;
background-color: purple;
}
</style>
</head>
<body>
<div></div>
</body>
</html>