CSS3可以做很多特效，今天青岛星网带大家一起学习用CSS3制作上下移动、鼠标放上去放大、旋转放大、360度旋转，纯CSS3制作。
<a class="a">上下移动</a> <a class="a2">旋转放大</a> <a class="a3">放大效果</a> <a class="a4">360度旋转</a>
.a{transition:All .4s ease-in-out;-webkit-transition:All .4s ease-in-out;-moz-transition:All .4s ease-in-out;-o-transition:All .4s ease-in-out;width:200px;height:200px;background-color:#000;display:block;margin:20px auto;color:#fff;text-align:center;line-height:200px;font-size:20px;font-weight:700}
.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)}
.a2{transition:All .4s ease-in-out;-webkit-transition:All .4s ease-in-out;-moz-transition:All .4s ease-in-out;-o-transition:All .4s ease-in-out;width:200px;height:200px;background-color:#000;display:block;margin:20px auto;color:#fff;text-align:center;line-height:200px;font-size:20px;font-weight:700}
.a2:hover{transform:rotate(360deg) scale(1.2);-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2);-o-transform:rotate(360deg) scale(1.2);-ms-transform:rotate(360deg) scale(1.2)}
.a3{transition:All .4s ease-in-out;-webkit-transition:All .4s ease-in-out;-moz-transition:All .4s ease-in-out;-o-transition:All .4s ease-in-out;width:200px;height:200px;background-color:#000;display:block;margin:20px auto;color:#fff;text-align:center;line-height:200px;font-size:20px;font-weight:700}
.a3:hover{transform:scale(1.2);-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);-ms-transform:scale(1.2)}
.a4{transition:All .4s ease-in-out;-webkit-transition:All .4s ease-in-out;-moz-transition:All .4s ease-in-out;-o-transition:All .4s ease-in-out;width:200px;height:200px;background-color:#000;display:block;margin:20px auto;color:#fff;text-align:center;line-height:200px;font-size:20px;font-weight:700}
.a4:hover{transform:rotate(360deg);-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}大家可以自行预览哦
在线QQ：
