Llista amb icona personalitzada

Aquesta és una altra manera de posar una icona a una llista <li>. Al css posarem:

.mac {
font-size: 11px;
padding-left: 17px;
margin-bottom: 5px;
background:url(images/macosx.gif) bottom left no-repeat;
List-style:none;
}

I al document html:

<li class=”mac”>Macintosh</li>

Canviar l’icona de <li>

Al css hem de definir la imatge mitjançant el següent codi:

li {list-style-image:url(imatge.gif)}

L’efecte aconseguit és:

Comentari 1
Comentari 2

en lloc de:

Comentari 1

Comentari 1