Hallo Sahabat Dumet, pada pertemuan kali ini saya akan membuat tutorial bagaimana cara mengganti icon list menjadi sebuah gambar sesuai seperti apa yang kita inginkan. Secara default, icon list di HTML kan bentuknya bulat seperti ini.
Nah, kalo tampilannya seperti itu kan kurang menarik. kita bisa merubahnya menggunakan gambar yang kita mau. Caranya mudah sekali loh… kita cukup memberikan style “list-style-image” pada CSS. Mari kita praktikan sama-sama ya… Silahkan Sahabat ketikkan kode HTML di bawah ini.
Kemudian berikan style CSS nya seperti ini.
Jika sudah, silahkan sahabat jalankan file .html nya di browser. Maka hasilnya akan seperti ini.
Oiyaaa… sebelumnya sahabat siapkan dahulu image untuk dijadikan gambar list nya dengan ukuran yang kecil saja. Missal 20pixel x 20pixel. Kemudian pada pada property list-style-image tinggal di brows filenya.
Okay, sampai jumpa di tulisan selanjutnya yaa sahabat. :)
0 komentar:
Posting Komentar