Come utilizzare un'immagine come un proiettile

December 6

Come sviluppatore sito web, si ha grande libertà nel modo di approccio progettare le pagine Web. A volte, si potrebbe desiderare di usare un file immagine come un proiettile in una lista non ordinata al posto del semplice, proiettile rotondo tipicamente utilizzati negli elenchi. Per codificare un'immagine come un proiettile in HTML, è necessario caricare l'immagine sul server Web e quindi aggiungere un paio di righe di codice HTML per la pagina Web.

istruzione

1 Carica l'immagine che si intende utilizzare, come i proiettili in una lista non ordinata al server Web. Annotare l'URL dell'immagine.

2 Aprire la pagina Web che si desidera modificare in un editor di testo standard quale Blocco note o in qualsiasi applicazione editor HTML.

3 Inserire il seguente codice nella tua pagina Web in cui si desidera visualizzare l'elenco:

<Style ul = "list-style-image: URL (http://www.URL.com/image.gif);">

Sostituire "http://www.URL.com/image.gif" in questo esempio con l'URL per l'immagine che hai appena caricato.

4 Creare voci dell'elenco aggiungendo la seguente riga immediatamente sotto il codice nel passaggio precedente:

<Li> proiettile </ li>

Sostituire "Bullet" con il proprio testo proiettile. Ripetere questo passaggio per il maggior numero di proiettili come si vuole apparire nella lista non ordinata.

5 Aggiungere un tag di chiusura alla fine della lista:

</ Ul>

6 Salvare il file modificato, caricarlo sul server Web e visualizzare la pagina nel browser per verificare che i proiettili di immagine vengono visualizzati correttamente.