Assalammu'alaikum Wr.Wb | Tidak Bosan Kami Kali ini TB4all Akan Memberitahu Bagaimana Cara Membuat Menu Horizontal Dengan Style CSS,Tanpa Banyak Basa-Basi TB4all Akan Langsung Memberitahu Cara Membuat Menu Horizontal Dengan Style CSS.
Caranya :
1. Masuk Ke Akun Blogger Sobat
2. Pergi Ke Bagian Edit HTML
3. Dari Kode :
/* Header4. Simpan Kode Dibawah Ini Tepat Di Bawah Kode Yang Tadi Dicari
-----------------------------------------------
*/
#pilihan {
width: auto;
height: 58px;
background-color: #242424;
background-attachment: scroll;
border: 5px outset #FFF;
cursor: crosshair;
}
#pilihan #resep {
height: 20px;
width: auto;
font-family: "Comic Sans MS", cursive;
font-size: 16px;
font-variant: normal;
text-transform: none;
color: #FFF;
font-style: normal;
line-height: normal;
text-decoration: none;
position: absolute;
float: left;
text-align: center;
padding-left: 200px;
}
#pilihan #resep a {
display: block;
float: left;
padding: 15px;
color: #FFF;
text-decoration: none;
}
#pilihan #resep a:hover {
color: #FFF;
text-decoration: none;
background-color: #F90;
border-right-width: 5px;
border-bottom-width: 5px;
border-top-width: 5px;
border-left-width: 5px;
border-top-style: inset;
border-right-style: inset;
border-bottom-style: inset;
border-left-style: inset;
border-right-color: #FFF;
border-bottom-color: #FFF;
border-top-width: #FFF;
border-left-color: #FFF;
cursor: crosshair;
}
5. Lalu Cari Kode <body> dan Simpan Script CSS Atau Bisa di Bilang Script Pemanggil Dibawah Tepat Bawah Kode <body>
<div id="pilihan">6. Jika Sudah Save dan Lihat Yang Terjadi ^_^
<div id="resep">
<a href="#"> Home</a>
<a href="#">Contact Us</a>
<a href="#">About Us</a>
<a href="#">Link Exchange</a>
<a href="#">Guest Book</a>
<a href="#">Daftar Isi</a>
</div>
</div>
Selesai Sudah Tutorial Dari TB4all Tentang Cara Membuat Menu Horizontal Dengan Style CSS, Terima Kasih Sudah Berkunjung Dan Membaca Artikel Dari Kami ^_^
Ket. Jika Ingin Mengganti Effect Cursornya Cari Aja Kode cursor: crosshair; Lalu Ganti Dengan Effect Cursor Yang Sobat Inginkan
No comments:
Post a Comment