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>