{ Tutorial } Menú Redes Sociales

Konnichiwa (*^ω^*)ハcomo les dije anteriormente estaré más activa y eso hago (? asdkjas equis,

hoy les traigo un menú de redes sociales (*~∇~*)ノ tiene un efecto en el cual da un giro de 360g. 

Live Preview

PLANTILLAS BLOGGER

Nos dirigimos a :

Diseño  Añadir un gadgetHTML/JAVASCRIPT

Añadimos este código:

<style>
a.navi{
text-transform:uppercase;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
a.navi:hover{
background-color: #FFDBB9;
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;
border-radius:10px;text-shadow:0px 0px 0px ;
}
</style>
<center>
<a class="navi" href="linkredsocial"title="Facebook">FB</a>
<a class="navi" href="linkredsocial"title="Twitter">Tw</a>
<a class="navi" href="linkredsocial"title="Tumblr">Tu</a>
<a class="navi" href="linkredsocial"title="Deviantart">Da</a></center><br />
<style>
a.navi{
text-decoration:none;
background-color: #DFDBFF;
display:inline-block;
padding-left: 2px;padding-right: 2px; padding-top:10px;
text-align: center;
color:#fff;width:30px;height:22px;
border-radius:50px;box-shadow:0px 0px 3px 2px #eee;
border:3px solid #ffffff;
text-transform:uppercase;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}</style>

Url de la página.
Color de fondo del menú.
Color de fondo del menú al pasar el cursor.
Nombre de la página{ Como son redes sociales es recomendable
poner solo dos letras como FB ,TW,si pones más el menú podria 
parecer otra cosa sakjda xdd}
Nombre que deseas que aparezcan{ Me explico; al pasar el cursor
nos aparece una pequeña ventanita indicando que es }

{ Normalmente }



{ Para los que usamos Tooltip personalizado }

Color de borde
Tipo de borde
Color de letra
Color de sombra

Si usas plantilla blogskin peguen el código en el lugar deseado.
Hasta aquí,nos vemos en la próxima entradaヽ( ´ ▽ ` )ノ