Welcome here! Please leave your comment and follow my blog. Use CTRL+C to copy (no right click allowed)
This blog is full of tutorials. Please use them, by clicking the "STUFF" page above^^ Thanks for your visit!!
I'm Gifta, I can't online everyday /^-^\/>

Thank you for your visit, please use my tutorials...!
August 05, 2016

Wednesday, May 20, 2015

Navigation Style (2)

Ara request, nih! Dia tanya cara buat navigation / menu tab kayak punyaku itu ... Aku dapet tutorial ini dari Kak Fathima pertamanya. Oke, yuk, langsung

Home About Stuff Linkies Request? Facebook Twitter Tumblr Ask.fm Karyaku Follow
THAT'S THE LIVE PREVIEW
1. Blogger > Dashboard > Layout > Add a Gadget > HTML/JavaScript
2. Kosongkan title-nya
3. Copas kode di bawah ini:
<style>
a.gelato{
border-top-left-radius: 6px;
border-top-right-radius: 6px;
border:1px solid #000;
font-family:trebuchet ms;
font-size:12px;
text-transform:uppercase;
text-align:center;
background-color:#FFDDAC;
color:#000000;
display:inline-block;
width:80px;
padding:3px;
margin:1px;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
}
a.gelato:hover{
background:#FFEACC;
}
a.banana{
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
border:1px solid #000;
font-family:trebuchet ms;
font-size:12px;
text-transform:uppercase;
text-align:center;
background-color:#FFC5E9;
color:#000000;
display:inline-block;
width:80px;
padding:3px;
margin:1px;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
}
a.banana:hover{
background:#FFDFF3;
}
</style>
<center>
<a class="gelato" href="URL BLOG KAMU">Home</a>
<a class="banana" href="URL PAGE KAMU">About</a>
<a class="gelato" href="URL PAGE KAMU">Stuff</a>
<a class="banana" href="URL PAGE KAMU">Linkies</a>
</center>
<br />
4. Save!
NOTE: Kalau mau menambahkan page lagi, copy kode di bawah dan paste di BAWAH yang <a class="banana" href="URL PAGE KAMU">Linkies</a>
<a class="gelato" href="URL PAGE KAMU">JUDUL PAGE</a>
<a class="banana" href="URL PAGE KAMU">JUDUL PAGE</a>
Nah, sudah selesai! Kalau gagal, tanya aja ke aku di komentar


There are 8 comments.
Please post another comment..

  1. @Alma Raisha Ara oke, sama-sama Ara ... thx juga sudah pakai tutorialku

    ReplyDelete
  2. Tapi aku pake hp ribet ngeditnya deh... U_U

    ReplyDelete
  3. Gifta, ini tutorialku bukan ya?, kalau iya lain kali tolong pake creditnya

    ReplyDelete
    Replies
    1. ngga kok, yang ini aku buat sendiri

      Delete
  4. oh, kirain, soalnya kodenya hampir mirip

    ReplyDelete