Liste HTML (in senso stretto) e caselle di selezione
Il linguaggio HTML supporta diversi elementi per la creazione di liste. I tag specifici per questo scopo sono i tag <ol> e <ul> i quali definiscono, rispettivamente, liste ordinate e non ordinate. Questi tag, a loro volta, incapsulano un numero indeterminato di tag <li> che identificano i singoli item della lista.
Se volessimo creare, in HTML, una lista non ordinata, ad esempio, utilizzeremmo un markup del genere:
<ul> <li>Mario Rossi</li> <li>Gianni Bianchi</li> <li>Lucia Verdi</li> </ul>
Il quale produrrebbe il seguente output:
- Mario Rossi
- Gianni Bianchi
- Lucia Verdi
Se sostituissimo il tag <ul> con <ol> il risultato, invece, sarebbe il seguente:
- Mario Rossi
- Gianni Bianchi
- Lucia Verdi
Oltre a questi tag, HTML consente la creazione di un altro tipo particolare di liste mediante il tag <select>, attraverso il quale è possibile creare delle caselle di selezione, cioè degli elementi di interazione dove l'utente può selezionare una voce da una lista di opzioni disponibili (cd. "menu a tendina"). Le singole voci della casella di selezione sono contrassegnate dal tag <option>.
Di seguito un esempio di markup HTML per la creazione di una select box:
<select> <option>Mario Rossi</option> <option>Gianni Bianchi</option> <option>Lucia Verdi</option> </select>
Il risultato a video sarebbe qualcosa del genere:
Per maggiori informazioni su come creare delle liste in HTML vi rimando ai seguenti articoli:
Utilizzare lo strumento di creazione liste HTML e caselle di selezione
La creazione di liste in HTML può essere una procedura lunga e noiosa per lo sviluppatore di pagine web. Se la creazione di liste di pochi elementi non presenta particolari problemi, viceversa la compilazione di liste composte da decine o centinaia di elementi può richiedere davvero parecchio tempo.
Fortunatamente lo strumento in questa pagina consente di risparmiare molta fatica per la creazione delle vostre liste HTML o caselle di selezione: basta scrivere un elenco di testo per poterlo trasformare automaticamente nel codice HTML di cui abbiamo bisogno!
Se disponiamo già di una lista testuale di elementi, invece, la procedura è ancora più veloce: basta copiare ed incollare l'elenco di testo nella textarea, selezionare le opzioni desiderate e cliccare sul bottone per ottenere il codice HTML pronto all'uso.
Le potenzialità di questo strumento sono davvero interessanti, infatti:
- grazie alla possibilità di impostare il separatore, è possibile convertire elenchi di testo di vario tipo: sia elenchi di voci in colonna (ritorno a capo) che elenchi di voci separate da virgola o punto e virgola;
- è possibile "pulire" automaticamente gli elenchi di testo dai più comuni marcatori di posizione utilizzati per contraddistinguere e/o numerare le singole voci dell'elenco: in questo modo non dovrete fare a mano il lavoro di pulizia prima di convertire il testo in HTML;
- è possibile scegliere l'output desiderato, selezionado il markup della lista HTML che verrà prodotta alla pressione del pulsante.
Come avrete capito, si tratta di uno strumento prezziosissimo che potrebbe farvi risparmiare un sacco di tempo e fatica.
