sudah lama ngan berbagi tips
belajar html, nah pada kesempatan ini saya akan coba membagikan tips
yang sudah sangat umum digunakan namun sangat bermanfaat banyak yaitu Belajar membuat menu drop down
Adapun keuntungan dari menggunakan menu drop down sendiri adalah kita
dapat mengatur posisi yang kita inginkan selain itu kita juga dapat
mengatur ukuran panjang dan lebar kotak drop downnya.
Pada menu drop down sendiri kita bisa memasukkan apa saja yang kita
inginkan, bisa berupa link, gambar, index, dll jadi ini akan sangat
membantu tata letak dari blog atau web kita.
Teknik pembuatannya sangat sederhana saja:
<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: auto; height: 400px; text-align: left;">
(isi dengan kode, data, gambar atau file apa saja disini)
div>
Sebagai contoh saya ingin membuat menu partner link di halaman utama maka penulisannya menjadi:
<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: auto; height: 400px; text-align: left;">
<ul>
<li ><a href="http://www.youtube.com">youtube</a></li>
<li><a href="http://www.cerdaskom.com" target="_blank"
alt="Free download tips blog.">Free download Tips
Blog</a></li>
<li class="vcard"><a class="fn url"
href="http://septia-mujizat.blogspot.com" rel="friend
target="_blank">Septia's Blog</a></li>
</ul>
div>
Catatan:
Border: 1px merupakan garis tepi, bisa diganti 0 tanpa garis tepi atau 2 jadi lebih tebal
Overflow: auto (otomatis menyesuaikan drop downnya)
Width: Auto merupakan lebar, anda bisa mengaturnya berupa angka atau auto artinya otomatis menyesuaikan dengan lebar blog atau web
Heigh: 400px merupakan tinggi dari menu drop down yang kita buat
text-align: left : penulisannya apakah rata kiri (left), rata kanan (right) atau center tergantung anda.
Diatas sengaja saya berikan 3 jenis link yang berbeda supaya rekan rekan paham bahwa penulis link pun memiliki tekni tersendiri:
1. link pertama yaitu youtube pemulisannya menggunakan model biasa
2. Link kedua yaitu cerdaskom punya saya sendiri ketika di klik akan
membuka di halaman baru, selain itu alt merupakan penjelasan tentang web
sehingga akan lebih mudah di index oleh google
3. Menggunakan vcard, mengenai vcard saya pikir rekan-rekan pasti sudah tahu kan.
Oke semoga artikel diatas membantu!
Friday, August 31, 2012