1. HTML Lezione 2 Elementi HTML di base

2. Paragrafi • Il paragrafo è una unità di testo che viene considerata distinta da altre parti del testo. • L’elemento HTML per il paragrafo è p. • I browser tracciano il contenuto di un paragrafo in un blocco rettangolare che: • occupa l’intera larghezza della pagina • inizia automaticamente con una nuova riga • lascia una spaziatura tra i paragrafi maggiore dell’interlinea tra le righe di testo. • Si dice che il paragrafo è un elemento di tipo block level.

3. Esempio Il seguente codice HTML definisce due paragrafi Il browser li rende così (lo sfondo è stato aggiunto)

4. A capo • Quando si va a capo nel codice HTML, questo a capo non viene considerato nel browser. • Nel codice dopo ogni nomesi va a capo ma viene tracciato nelbrowser in una unica riga

5. L’elemento br • Per interrompere una riga, HTML fornisce l’elemento br • Questo elemento ha solo un tag (che viene scritto <br />) e non ha contenuto. • Questo elemento viene anche scritto <br> • Il codice viene reso

6. Titoli • Un documento è solitamente suddiviso in sezioni, sottosezioni, etc. • Le varie sezioni hanno dei titoli, i quali vengono di solito resi in modo diverso a seconda del livello di importanza (gerarchico). • HTML fornisce 6 tipi di titoli. • Gli elementi sono h1, h2, h3, h4, h5 e h6(h è l’iniziale di header = intestazione) • I browser tracciano tutti i titoli grassettati e con dimensione del carattere via via decrescente.

7. Esempio • Internet Explorer traccia i sei titoli in questo modoIl codice HTMLCome viene reso

8. Problemi con i paragrafi • Uno dei problemi del paragrafo come contenitore è che un paragrafo non può contenere internamente altri paragrafi o altri contenitori a livello blocco. • Ad esempio, il seguente codice viene resoma in effetti per HTML ci sono due paragrafi, uno prima del titolo e uno dopo. Il titolo interrompe il paragrafo.Mettendo un colore di sfondo nel paragrafo lo si evidenzia:

9. Divisioni • HTML fornisce un importante elemento-blocco che può contenere altri elementi. • L’elemento div può contenere altri elementi blocco, senza essere interrotto • Nel codice l’intestazione è contenuta nel dive non lo interrompe Il colore di sfondo nel div evidenzia ciò:

10. Esempio • Il fatto che gli elementi div possono essere inseriti uno nell’altro permettono di ottenere effetti di questo tipo. • Nell’esempio, ai due div sono stati applicati si un colore di sfondo che un bordo (non presenti nel codice)

11. Elenchi • L'HTML offre molti meccanismi per specificare elenchi di informazioni. Tutti gli elenchi devono contenere uno o più voci di elenco. • Un elenco è un insieme di voci che vengono riprodotti con un punto o con un ordinale. elenco non ordinato elenco ordinato

12. Elementi HTML per gli elenchi • Per gli elenchi ordinati HTML fornisce l’elemento ul (unordered list) • Per quelli ordinati c’è l’elemento ol (ordered list) • Le voci di elenco sono individuate dall’elemento li (list). Esempio Il codice HTML viene reso

13. Esempi di elenchi Il codice HTML viene reso Elenchi annidati