纯css实现坤坤经典动作-“铁山靠”
"铁山靠"这个动作在纯CSS中可以通过关键帧动画（keyframe animations）和CSS的animation属性来实现。以下是一个简单的示例，演示如何用CSS来模拟“铁山靠”这个动作：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>铁山靠动画</title>
<style>
.titan {
width: 100px;
height: 100px;
background: red;
position: relative;
animation: titan-lean 2s infinite alternate;
}
@keyframes titan-lean {
0% {
transform: rotate(0deg) translateX(0);
}
50% {
transform: rotate(10deg) translateX(20px);
}
100% {
transform: rotate(0deg) translateX(0);
}
}
</style>
</head>
<body>
<div class="titan"></div>
</body>
</html>这段代码中定义了一个.titan类，它有一个无限循环且每次循环交替方向的titan-lean动画。动画通过transform属性的rotate和translateX函数来实现转体和向右位移的效果。通过调整@keyframes中的百分比和具体的transform值，可以控制动画的进程和结果。
评论已关闭