Elenchi: ordinati e non ordinati
Crei elenchi numerati e puntati
Elenchi: ordinati e non ordinati è una lezione HTML for Kids gratuita su CoddyKit. Questa è la lezione 2 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento HTML for Kids, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso HTML for Kids include 4 lezioni in totale.
Elenchi ordinati e non ordinati
Benvenuti nella prossima lezione! Oggi impareremo a creare elenchi in HTML. Gli elenchi aiutano a organizzare le informazioni e ne facilitano la lettura.
Che cosa sono gli elenchi?
Gli elenchi sono un ottimo modo per raggruppare elementi correlati. HTML offre due tipi principali di elenchi:
- elenchi ordinati: gli elementi sono numerati (1, 2, 3...).
- elenchi non ordinati: gli elementi sono contrassegnati da punti elenco.
Impariamo a creare entrambi i tipi!
Creare un elenco ordinato
Un elenco ordinato si crea usando il tag <ol>. Ogni elemento dell'elenco viene aggiunto usando il tag <li> (elemento dell'elenco).
Esempio:
<ol>
<li>Wake up</li>
<li>Eat breakfast</li>
<li>Go to school</li>
</ol>
Creare un elenco non ordinato
Un elenco non ordinato si crea usando il tag <ul>. Ogni elemento viene aggiunto usando il tag <li>, proprio come negli elenchi ordinati.
Esempio:
<ul>
<li>Apples</li>
<li>Bananas</li>
<li>Cherries</li>
</ul>
Elenchi nidificati
È possibile creare un elenco all'interno di un altro elenco. Questo viene chiamato elenco nidificato. È possibile nidificare elenchi ordinati e non ordinati l'uno nell'altro.
Esempio:
<ul>
<li>Fruits
<ul>
<li>Apples</li>
<li>Bananas</li>
</ul>
</li>
<li>Vegetables
<ul>
<li>Carrots</li>
<li>Spinach</li>
</ul>
</li>
</ul>
Elenchi con descrizioni
HTML consente anche di creare elenchi di descrizioni usando i tag <dl>, <dt> e <dd>:
<dl>: definisce l'elenco.<dt>: definisce il termine (titolo).<dd>: definisce la descrizione.
Esempio:
<dl>
<dt>HTML</dt>
<dd>The language used to create web pages.</dd>
<dt>CSS</dt>
<dd>The language used to style web pages.</dd>
</dl>Aggiungere uno stile agli elenchi
È possibile usare CSS per modificare l'aspetto degli elenchi. Ad esempio, è possibile modificare il tipo di punti elenco o di numeri.
Esempio:
<style>
ul {
list-style-type: square; /* Changes bullets to squares */
}
ol {
list-style-type: upper-roman; /* Changes numbers to Roman numerals */
}
</style>
<ul>
<li>Apples</li>
<li>Bananas</li>
</ul>
<ol>
<li>First Step</li>
<li>Second Step</li>
</ol>
Provi Lei
Creiamo una semplice pagina web con elenchi ordinati e non ordinati. Ecco un esempio:
<!DOCTYPE html>
<html>
<head>
<title>HTML Lists</title>
</head>
<body>
<h1>My To-Do List</h1>
<h2>Morning Routine</h2>
<ol>
<li>Wake up</li>
<li>Brush my teeth</li>
<li>Have breakfast</li>
</ol>
<h2>Shopping List</h2>
<ul>
<li>Milk</li>
<li>Bread</li>
<li>Eggs</li>
</ul>
</body>
</html>
Ottimo lavoro!
Congratulazioni! Ha imparato a creare elenchi ordinati e non ordinati, elenchi nidificati ed elenchi di descrizioni. Sono strumenti molto utili per organizzare le informazioni nelle pagine web. Nella prossima lezione impareremo ad aggiungere collegamenti per connettere pagine e siti web diversi. Si prepari a divertirsi ancora!
Domande Frequenti
La lezione «Elenchi: ordinati e non ordinati» è gratuita?
Sì — il testo completo di «Elenchi: ordinati e non ordinati» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso HTML for Kids, passa a CoddyKit PRO. Il corso HTML for Kids include 4 lezioni in totale.
Cosa imparerò in «Elenchi: ordinati e non ordinati»?
Crei elenchi numerati e puntati Eserciti HTML for Kids con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare HTML for Kids?
Non è richiesta alcuna esperienza precedente. HTML for Kids su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 2 di 4.
Quanto tempo richiede la lezione «Elenchi: ordinati e non ordinati»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione HTML for Kids?
Sì. Ogni lezione HTML for Kids include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Titoli e paragrafi
- Elenchi: ordinati e non ordinati
- Collegamenti: connettere il Web
- Immagini: aggiungere immagini alla pagina