html 晃动效果,css3特效（上下左右晃动效果）

Document

.animated {

animation-duration: 2s; /*动画时间*/

animation-fill-mode: both; /*播放后的状态*/

}

.animated {

animation-iteration-count: infinite; /*动作循环的次数：infinite 无限循环*/

}

.animated {

animation-duration: 2s; /*动画时间*/

}

.up,.around {

background: #2D97DB;

width: 90%;

height: 90%;

padding: 20px;

margin: 20px auto;

font-family: "微软雅黑";

font-size: 40px;

color: white;

text-align: center;

line-height: 90%;

}

.around{

background-color: #44a036;

}

.up{

animation-name:upAnimation; /*动画的名称*/

transform-origin: center bottom; /*设置动画旋转元素的基点为*/

cursor: pointer;

}

.around{

animation-name:aroundAnimation; /*动画的名称*/