Trik Mengganti Bullet List Dengan Check List

Mengganti Bullet List Dengan Check List - Pada tampilan dokumen HTML terkadang kita menginginkan terlihat lebih unik dan terlihat menarik. Selain itu mungkin kita hanya ingin memperjelas informasi tertentu, dalam hal ini misalnya kita ingin informasi tersebut diletakan pada poin-poin khusus atau list-list khusus. Untuk membuat poin atau list tersebut kita menggunakan model Bullet list.

Namun apakah anda tidak merasa bosan dengan tampilan bullet list, berikut ini saya akan berbagi trik merubah tampilan bullet list menjadi Check List. Pastinya tampilan artikel anda akan semakin keren saat menggunakan chek list berikut ini, dan kerennnya lagi check list ini memiliki efek saat disentuh cursor. jika anda penasaran berikut ini langkah mudahnya

Trik Mengganti Bullet List Dengan Check List

=> Login keakun Blogger anda
=> Pilih Template
=> Klik Edit Template
=> Selanjutnya anda cari kode  ]]></b:skin>
=> Jika sudah anda letakkan kode dibawah ini sebelum kode   ]]></b:skin>

.post-body ul, .post-body ol{   margin: 1em;   padding-left: 1em; } .post-footer ul{   margin: 1em;   margin-top: -0.5em;   padding-left: 1em; } .post-body ul li, .post-footer ul li {   list-style-image: url(https://sites.google.com/site/webhostingaak/image/uncheck-1.gif);   border-bottom: 1px solid #ccc;   padding: .2em 0 .2em .5em; } .post-body ul li:hover, .post-footer ul li:hover {   cursor: pointer;   list-style-image: url(https://sites.google.com/site/webhostingaak/image/check-1.gif);   background-color: #f2f2f2;   color: #3B5998;

=> Simpan Template

Anda jangan merasa kecil hati dulu jikan check list tidak terlihat karena Check list akan terlihat jika artikel anda sudah di publikasikan.

Sekian dari saya Trik Mengganti Bullet List Dengan Check List, semoga bermanfaat!

Share this post