girlwithbighead 
09/10/2012 | 11 comments
My own coding, don't re-post.
Link Hover Type One : example one
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:2px;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration:none;
-webkit-background-clip: text;
color: white;
-webkit-text-fill-color: transparent;
background-image:-webkit-gradient(linear, left top, right top, from(#ea8711), to(#d96363));
background-image:-webkit-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-moz-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-ms-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-o-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);}
Link Hover Type Two : example two
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:2px;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration:none;
color: white;
background-image:-webkit-gradient(linear, left top, right top, from(#ea8711), to(#d96363));
background-image:-webkit-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-moz-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-ms-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image:-o-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);}
Link Hover Type Three : example three
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:4px;
border-radius: 10px 0px 10px 0px;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration:none;
background:#000;}
Link Hover Type Four : example four
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:4px;
border-top:2px solid transparent;
border-bottom:2px solid transparent;
border-radius: 10px ;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
border-top:2px solid pink;
border-bottom:2px solid pink;
text-decoration:none;}
Link Hover Type Five : example five
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:4px;
border-right:2px solid transparent;
border-left:2px solid transparent;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
border-right:2px solid pink;
border-left:2px solid pink;
text-decoration:none;}
Link Hover Type Six : example six
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;
padding:4px;
background:transparent;
box-shadow: inset 0px 0 0px 0 brown;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
overflow:hidden;
box-shadow: inset 200px 0 0px 0 brown;
text-decoration:none;}
Link Hover Type Seven : example seven
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-shadow:100px 0px 0px #333333;
text-decoration:none;}
Link Hover Type Eight : example eight
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-shadow:10px 10px 1px #333333;
text-decoration:none;}
Link Hover Type Nine : example nine
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-shadow:0px -10px 1px #333333;
text-decoration:none;}
Link Hover Type Ten : example ten
a:link,a:visited{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:pink;
text-decoration:none;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-shadow:-1px 0px 9px #333333;
text-decoration:none;}
OLDERNEWER