html向下移动动画效果,CSS3创建上下移动的动画效果

上下移动

.a{

transition:All 0.4s ease-in-out;

-webkit-transition:All 0.4s ease-in-out;

-moz-transition:All 0.4s ease-in-out;

-o-transition:All 0.4s ease-in-out;

width:200px;

height:200px;

background-color:#000000;

display:block;

margin:100px auto;

color:#fff;

text-align:center;

line-height:200px;

font-size:20px;

font-weight:bold;

}

.a:hover {

transform:translate(0,-10px);

-webkit-transform:translate(0,-10px);

-moz-transform:translate(0,-10px);

-o-transform:translate(0,-10px);

-ms-transform:translate(0,-10px);

}

上下移动