1 <html lang="en">
 2 
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 7     <title>过渡</title>
 8     <style>
 9         div {
10             width: 200px;
11             height: 200px;
12             background-color: azure;
13             /* 对谁做过渡动画,就把过渡属性写在谁身上 */
14             /* transition: width 0.5s ease 0s, height .3s ease-in 1s; */
15             transition: all 0.5s ease 0s
16         }
17         
18         div:hover {
19             width: 400px;
20             height: 400px;
21         }
22     </style>
23 </head>
24 
25 <body>
26     <!-- transition 过渡效果 -->
27     <!-- transition 要过渡的曲线 花费时间 运动曲线  何时开始 -->
28     <div></div>
29 </body>
30 
31 </html>