css3实现页面元素抖动效果
CSS3可以通过animation和keyframes来实现页面元素的抖动效果。以下是一个简单的例子，展示了如何使用CSS3为一个元素添加抖动动画：
@keyframes shake {
0% { transform: translateX(0); }
25% { transform: translateX(-5px); }
50% { transform: translateX(5px); }
75% { transform: translateX(-5px); }
100% { transform: translateX(5px); }
}
.shake-animation {
animation: shake 0.5s; /* 抖动的持续时间 */
animation-iteration-count: infinite; /* 动画重复次数 */
}在HTML中，你可以给需要抖动的元素添加shake-animation类：
<div class="shake-animation">抖动的元素</div>这段代码定义了一个shake的关键帧动画，它会让元素在水平方向上左右抖动。通过将这个动画应用到你想要抖动的元素上，就可以实现抖动效果。
评论已关闭