Il tag <LI> in Html
In questa lezione ti spiego come usare il tag <li> del linguaggio HTML
<li> </li>
Questo tag ti permette di creare una lista di elementi all'interno del tag <ul> (unordered list) o del tag <ol> (ordered list).
Il nome del tag <li> è l'abbreviazione di "list item", ovvero elemento della lista.
Ad esempio, se devi creare una lista di ingredienti per una ricetta, puoi usare il tag <ul> e inserire ciascun ingrediente con il tag <li>:
<ul>
<li>1 pomodoro</li>
<li>50 grammi di olive</li>
<li>2 cucchiai di olio</li>
</ul>
Ti faccio un esempio pratico.
Ricorda che puoi usare il tag <li> dentro il tag <ul> o il tag <ol> nella sezione <body> del documento Html.
- <!DOCTYPE html>
- <html>
- <head>
- ...
- </head>
- <body>
- <ul>
- <li>1 pomodoro </li>
- <li>50 grammi di olive</li>
- <li>2 cucchiai di olio </li>
- </ul>
- ...
- </body>
- </html>
Nel documento stai utilizzando il tag <ul> per creare una lista non ordinata.
Poi utilizzi il tag <li> per inserire ogni punto della lista.
In questo modo, gli ingredienti della ricetta sono visualizzati in una lista puntata.
Puoi usare il tag <li> anche all'interno di un'altra lista annidata.
<ul>
<li>Voce 1 <ul><li>Sottovoce 1a</li><li>Sottovoce 1b</li></ul></li>
<li>Voce 2</li>
<li>Voce 3</li>
</ul>
In questo modo puoi creare una lista all'interno di un'altra lista.
Nota. Se vuoi modificare il simbolo di ogni punto della lista ti consiglio di modificare lo stile CSS del tag <ul> o <ol>. Puoi vedere un esempio pratico nella lezione dedicata al tag <ul>
In conclusione, il tag <li> è un elemento molto utile per organizzare e strutturare il contenuto della pagina.
E' uno degli elementi HTML più comuni e usati per creare liste di elementi.
Puoi usarlo insieme ad altri tag HTML per creare layout più complessi e per organizzare il contenuto della pagina in modo chiaro e intuitivo.
