A volte ci vuole solo un po ' di novità per rendere una pagina Web di distinguersi dal resto. Come uno sviluppatore di siti, puoi sperimentare combinazioni di colori audaci, provare nuovi font esotici o semplicemente apportare piccole modifiche a un elemento di elenco HTML. Elenchi non ordinati - definiti utilizzando il tag HTML ul - visualizzare punti elenco rotondi standard per impostazione predefinita. Non devi usare quei proiettili per le vostre liste. Creare una classe CSS di una sola riga contenente un attributo "list-style-image" e si possono convertire punti di qualsiasi elenco un'immagine di vostra scelta.

Istruzioni

1

Aprite il vostro editor HTML e incollare questo codice nella sezione di testa di uno dei documenti HTML:

< style type = "text/css" >
.imageBullet {list-style-image: url(IMAGE_NAME);}
< / stile >

Questo codice crea la classe CSS che imposta il valore per list-style-image al nome specificato nell'attributo url. Sostituire "Nome_immagine" con l'URL di un'immagine sul Web.

2

Aggiungere il seguente codice alla sezione body del documento:

< ul classe = "imageBullet" >
Rosso < li > </li >
Blu < li > </li >
Verde < li > </li >
</UL >

Questo crea un semplice elenco che contengono colori. Si noti che il tag fa riferimento la classe CSS imageBullet. Perché fa riferimento a tale classe, l'elenco verrà impostato suoi proiettili utilizzando l'immagine definita nella classe CSS.

3

Salvare il documento e aprirlo in un browser per vedere i punti elenco immagine che vengono visualizzati nell'elenco.

Consigli & Avvertenze

• Ricordatevi di usare piccole immagini per i proiettili. Piccole immagini GIF come frecce fare pallottole eccellente.