How To Make Cute Navbar For Blog #1

by - November 10, 2017

Hasil gambar untuk anime girl happy gif
Hola, kak Sasha request cara bikin navbar kayak aku.

Tutorial ini adalah hasil karyanya http://kawaiilady.blogspot.co.id/. Cuman aku modifikasi sedikit :)


  • Masuk akun blog >> Dashboard >> Tata Letak >> HTML/JavaScript
  • Copas kode dibawah ini:

<style>
.tablo{
font-size:16px;
color:#FFE4E1;
text-transform:uppercase;
background:#FFF9FA;
font-family:century gothic;
border-radius:10px;
text-decoration:none;
padding:5px;
width: 80px;
display:inline-block;
border:2px solid #FFE3E6;
margin-top: 5px;margin-bottom: 5px;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.tablo:hover {
background:#FEFEE5;
color:#FFE4E1;
}
</style>
<center>
<div style="background: #FFEBED;width:997px;border: 2px solid #FFEEEE;margin-bottom:7px; margin-top:7px;box-shadow:0px 2px 2px 2px #ffeeee;border:3px solid #ffffff;">
<a class="tablo" href="https://blogspot.co.id/">Home</a>
<a class="tablo" href="https://blogspot.co.id/">Stuff</a>
<a class="tablo" href="https://blogspot.co.id/">Author</a>
<a class="tablo" href="https://blogspot.co.id/">Affies</a>
</div></center>

Merah: Lebar box Home, Stuff, Author, dan Affiesnya itu
Hijau: Lebar box yang paling belakang itu. Sesuaikan sendiri
Dan yang lain-lainnya itu, misalkan warna dan size font bisa kalian atur sendiri ya...

Bescode:  http://kawaiilady.blogspot.co.id/

You May Also Like

0 ice cream lover(s)

Ongoing Challenge