Iconos girando 360 grados

A la hora de mostrar los iconos sociales en nuestro blog, podemos darle un toque de originalidad con este efecto. Se trata de CSS3, aplicando las propiedades transform y rotate al hover de las imagenes, estas giran 360º sobre si mismas al pasar el cursor del raton sobre ellas. Para añadirlo en tu blog o web, solo tienes que copiar el codigo de abajo y ponerlo en un elemento HTML. Donde esta indicado en rojo, añades las urls de las imagenes y las de las de tus redes sociales.

CODIGO:

<center><div id="socialicons"><a href="URL FACEBOOK" target="_blank"><img height="50" src="URL IMAGEN" width="50" /></a><a href="URL GOOGLE PLUS" target="_blank"><img height="50" src="URL IMAGEN" width="50" /></a><a href="URL TWITTER" target="_blank"><img height="50" src="URL IMAGEN" width="50" /></a></div></center>
<style>
#socialicons img{
 -moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;}
#socialicons img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);}
</style>