Beauty Beauty - Stefani Gifta Ganda's Blog

Rabu, 20 Mei 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


By

There are 9 komentar.