Belajar Membuat Navigasi CSS

By Adhi P. - Last updated: Wednesday, March 7, 2012 - Save & Share - Comments

banner438kursus Belajar Membuat Navigasi CSS

Materi kali belajar css ini adalah navigasi bar. Perlu digaris bawahi mempunyai navigasi yang gampang digunakan adalah penting dalam suatu web. Dengan kode CSS dapat mengubah menu yang tidak enak dilihat menjadi tampilan yang sangat keren. Navigasi membutuhkan standar html sebagai dasarnya, dibawah ini akan saya contohkan membuat navigasi menggunakanliat html yang standar.

List navigasi biasanya berupa link, so.. gunakanlah <ul> dan <li> :


<ul>

<li><a href="default.asp">Home</a></li>

<li><a href="news.asp">News</a></li>

<li><a href="contact.asp">Contact</a></li>

<li><a href="about.asp">About</a></li>

</ul>

Hasil dari kode diatas adalah :

• Home

• News

• Contact

• About

Sekarang hilangkan tanda lingkaran, margin, dan padding :


ul

{

list-style-type:none;

margin:0;

padding:0;

}

Hasilnya :

Home

News

Contact

About

Kode dalam contoh di atas adalah kode standar yang digunakan navigasi vertikal dan horizontal.

 

Navigasi Vertikal

Selain kode standar di atas, untuk membuat navigasi vertikal memerlukan elemen a :

Contoh :


a

{

display:block;

width:60px;

}

Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek! KLIK DI SINI!.
Posted in Belajar CSS • Tags: , Top Of Page