Tutorial : Navigation Style #12

Tuesday, June 16, 2015

Assalamualaikum.

Lama dah tak dapat request finally *shed tears* hahaha. Terima kasih sebab request. Atas sebab request anda , berupadate jugak lah blog ni. Navigation kali ni jenis lekat atas tu. Kekalnya ia disitu tidak kira sejauh mana korang scroll blog hingga kebawah sekali pon. Ok lupakan.




Code ;

<style>
.navigation a {
font:13pt cambria;
text-decoration:none;
letter-spacing:2.5px;
text-transform:uppercase;
color:black;
padding:0px 30px 0px 30px;
text-shadow:4px 0px transparent, -4px -0px transparent;
-webkit-transition-duration:0.5s;
-moz-transition-duration:0.5s;
-ms-transition-duration:0.5s;
-o-transition-duration:0.5s;
transition-duration:0.5s;
}
.navigation a:hover {
text-shadow:0px 0px #888, -0px 0px #888;
}

</style>
<br />
<div style="left: 0px; padding: 0px; position: fixed; text-align: center; top: 0px; width: 100%; z-index: 999;">
<div class="navigation" style="background:url(http://i.imgur.com/Y2IYZl4.png); border: 1px solid #eee; margin: 0 auto; padding: 15px 0px 20px 0px; width: 1040px;">
<a href="LINK">LINK1</a>
<a href="LINK">LINK2</a>
<a href="LINK">LINK3</a>
<a href="LINK">LINK4</a>
<a href="LINK">LINK5</a>
</div>
</div>

Copy and Paste code diatas di ;

Dashboard > Layout > Add a Gadget > HTML/JavaScript > Save.


Macam biasa, mana code yang di-bold-kan sila ubah mengikut kesusaian blog korang. Sekian.



edited
"for those yang navigation ni bertindih dengan header korang. Sila ke Template >
Edit HTML dan cari code ni body { , dah jumpa sila tambah code : margin-top:110px; bawah code yang dicari tadi. yang warna biru tu, ubah ikut citarasa korang okay"


Bye. o/


3 comments:

© 2017 HAFIZ ZULKAFLY ALL RIGHTS RESERVED