FIFIANGGR - Personal Blog: Navigate Hover #2

Navigate Hover #2

1. Copy code ini

<style>

a.navi {

border:1px solid #ebebeb;

text-transform:uppercase;

background:#fff;

text-decoration:none;

color: #666; padding: 6px;

font: 8px yow;

margin-left: 5px; margin-right: 5px;

-webkit-transition: all 0.2s ease-in-out;

-moz-transition: all 0.2s ease-in-out;

-o-transition: all 0.2s ease-in-out;

-ms-transition: all 0.2s ease-in-out;

text-decoration:none;

box-shadow:inset 0px 0px 0px #111,

inset 0px 0px 0px #111; display: inline-block;

width: 65px;

}

a.navi:hover {

-webkit-transition-duration: 0.5s;

box-shadow:inset 0px 14px 0px #111,

inset 0px -14px 0px #111; color: #fff;

}

@font-face { font-family:yow !important;

src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;

}

</style>

<a class="navi" href="LINK">TITLE</a>

</center>

2. Paste dalam blog kamu
3. Preview & save

Biru : warna background
Pink : link / url
Purple : title

credit: Atiqah

0 comments