HTML中如何设置
图片抖动
如果你想让你的
图片在网页中出现抖动的
效果，那么你可以考虑使用CSS3动画
效果，具体步骤如下：
1. 在html中使用
img标签插入你的
图片（请确保你的
图片大小和展示位置都是正确的）：
```
```
2. 在CSS中定义动画
名称和动画样式：
```
.pre {
display: inline-block;
margin: 20px;
padding: 20px;
background-color: #fff;
border: 1px solid #ccc;
text-align: left;
}
.shake {
animation-name: shake;
animation-duration: 1s;
animation-i
teration-count: infinite;
}
@keyframes shake {
0% {transform: rotate(0deg);}
20% {transform: rotate(20deg);}
40% {transform: rotate(40deg);}
60% {transform: rotate(60deg);}
80% {transform: rotate(80deg);}
100% {transform: rotate(100deg);}
}
```
说明：
- 动画
名称为 shake，持续时间为 1 秒，无限循环；
- 关键帧的每
一个间隔相差20%，分别旋转角度为0度、20度、40度、60度、80度和100度。
3. 在 HTML 中应用动画样式 class：
```
```
通过上述设置，你就可以为你的
图片添加抖动的
效果了。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
