Tutorial Cara Buat List Style Image

click to zoom

Hai all..koz ade ilmu baru nak di kongsi dengan korang...
kebanyakkan korang mesti dah ada Tool List kat blog masing-masingkan...
sebagai contoh:-
  1. Budak nakal
  2. Budak comel
  3. Budak manja
Atau yang ini

  • Budak nakal
  • Budak comel
  • Budak manja
Jadi hari ini koz akan bagi tutorial nak gunakan icon sebagai pembahagi list korang seperti ini:-

  • Budak nakal
  • Budak comel
  • Budak manja

Cara-cara nak buat seperti biasa mudah sahaja...korang cuma gunakan code di bawah:-

<ul style="list-style-image:url(http://img99.imageshack.us/img99/7790/bigeyescreature16x16.png);">
<li>List Pertama</li>
<li>List Kedua</li>
<li>List Ketiga</li>
</ul>


Pada code tertulis List pertama,kedua dan ketiga tu korang boleh ganti dengan ayat yang korang nak...

Dan cara nak tambah list mudah sahaja korang cuma tambah code ini
<li>List Tambah</li>

sebelum atau di atas code ini
</ul>

Icon pulak korang boleh tukar dengan icon ke sukaan korang...Saiz icon tersebut jangan terlalu besar ,saiz terbaik adalah bawah 25X25...

Di sini koz Kongsikan sekali icon2 comel...lau berkenan ambil lah...



click to zoom
http://img692.imageshack.us/img692/7130/tentaclescreature16x16.png

click to zoom
http://img690.imageshack.us/img690/8579/whitecreature16x16.png

click to zoom
http://img17.imageshack.us/img17/5663/blackcreature16x16.png

click to zoom
http://img340.imageshack.us/img340/755/pinkcreature16x16.png

click to zoom
http://img69.imageshack.us/img69/7790/bigeyescreature16x16.png

click to zoom
http://img413.imageshack.us/img413/8315/greencreature16x16.png


Camat Mencuba...
Ranking: 5

Comments:7

Post a Comment

Komehlah dan klik G+ di atas sekali okey^^

 
Google PageRank Checker Powered by  MyPagerank.Net