Tutorial de
efectos de links
Este tutorial es muy útil
para adornar links de varias formas. Aquí tenéis
unos ejemplos para que queden mas bonitos n_n:
Primero copiáis el siguiente código debajo de <head>
<style type = "text/css">
<!--
a:hover {filter:blur(direction=425,strength=10); height:0;}
-->
</style>
Después, ya podéis ponerlo a vuestro gusto cambiando el a:hover por
los siguientes códigos:
Para difuminar el enlace:
a:hover {filter:blur(direction=425,strength=10);
height:0;}
Para recuadrar el enlace:
a:hover {text-decoration:
none;background-color: #FFE9B9;border: 1px solid #F4A600;}
Para añadirle sombra al enlace:
a:hover {filter:shadow(color:#9D9DA1,
direction=125); height:5}
Para que el enlace se mueva:
a:hover { position:
relative; left: 4; top: 3;}
Para que se cambie la fuente del enlace:
a:hover { font-size:14px;
color:#CC6699; font-family:Comic Sans MS; text-decoration:none; font-weight:bold;}
Para alinear el enlace (este queda muy mono)
a:hover {border-bottom:1px
dotted #ffffff; border-top:1px dotted #ffffff; color: #ffffff }
Para que el enlace se ponga al revés:
A:hover {text-transform:uppercase;
}
Para que el enlace cambie de blanco a negro, y de negro a blanco:
a:hover { filter:
Xray; HEIGHT: 0px;}
Esta es una recopilación de efectos muy cutes para vuestras webs. Siempre
podéis cambiarle el tamaño y los colores para que este a vuestro gusto ;)
<<atrás
|