CSS3动画--过渡效果
transition 设置四个过渡属性
transition-property 过渡的名称
transition-duration 过度效果花费的时间
transition-timing function 过渡效果的时间曲线
transition-delay 过渡效果开始时间
1、案例源码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS3动画--过渡效果</title>
<style>
*{margin: 0;padding: 0}
section{width: 200px;height: 200px;background-color: coral;transition:width 2s,height 2s, transform 2s;
margin: 50px auto;}
section:hover{width: 400px;height: 400px;transform:rotate(360deg);}
</style>
</head>
<body>
<section></section>
</body>
</html>
2、案例效果
相关文章：
-
2022-12-23
-
2022-12-23
-
2021-07-16
-
2021-12-03
-
2021-12-03
-
2021-12-03
-
2021-12-03
-
2021-10-07
猜你喜欢
-
2021-12-30
-
2021-11-30
-
2022-12-23
-
2022-12-23
-
2021-12-03
-
2021-12-03
相关资源
-
下载
2022-12-21
-
下载
2021-06-24
-
下载
2023-03-03
-
下载
2021-06-07
-
下载
2023-01-09