Lezione06: Altri elementi ~ Cerca Soluzione 3

Sei riuscita a fare le pagine da sola? Se no, qui c'è un esempio:


 <html>

   <head>
   <title>My website</title>
   </head>

   <body>
   <h1>Un titolo</h1>
   <p>testo, testo, testo, testo</p>
   <h2>Un sottotitolo</h2>
   <p>testo, testo, testo, teso</p>
   </body>
   
 </html>

Ora cosa ?

Ora è tempo di imparare sette nuovi elementi.

Allo stesso modo con cui hai fatto il testo in grassetto inserendolo tra il tag di apertura  e il tag di chiusura , puoi rendere il tuo testo corsivo usando il tag di apertura  e il tag di chiusura . E si, "i" è l'abbreviazione della parola inglese "italic".

Esempio 1:


 <i>Questo dovrebbe essere corsivo.</i>

Si vedrà in questo modo sul tuo browser:

Questo dovrebbe essere corsivo .

In maniera simile puoi rimpicciolire il tuo testo usando small:

Esempio 2:


 <small>Questo dovrebbe essere più piccolo.</small>

Si vedrà in questo modo sul tuo browser:

Questo dovrebbe essere più piccolo.

Posso utilizzare diversi elementi contemporaneamente?

Puoi usare facilmente diversi elementi contemporaneamente basta che eviti la loro sovrapposizione. Questo viene spiegato bene nell'esempio:

Esempio 3:

Se vuoi scrivere un testo in grassetto e in corsivo, dovresti fare in questo modo:


 <b><i>Testo in grassetto e in corsivo</i></b>

Ma NON così:


 <b><i>Testo in grassetto e in corsivo</b></i>

La differenza è che nel primo esempio abbiamo chiuso prima il tag che avevamo aperto per ultimo. In questo modo evitiamo di confonderci, sia noi che il browser.

Ancora elementi !

Come abbiamo già accennato nella Lezione 3 ci sono elementi che vengono aperti e chiusi nello stesso tag. Questi elementi vengono chiamati "elementi vuoti"e non sono collegati con uno specifico passaggio nel testo ma sono etichette isolate. Un esempio di questo tipo di tag è   che crea una linea vuota forzatamente:

Esempio 4:

Un po' di testo<br /> e un altro po' di testo su un nuova riga

Si vedrà così nel browser:

Un po' di testo
e un altro po' di testo su una nuova riga

Nota che il tag è scritto come contrazione di un tag aperto e uno chiuso, con uno psazio bianco e una barra alla fine:  .

Un altro elemento che viene aperto e chiuso nello stesso tag è <hr /> usato per disegnare una linea orizzontale ("hr" è l'abbreviazione per le parole inglesi "horizontal rule"):

Esempio 5:


 <hr />

Si vedrà così nel browser:

Esempi di elementi che necessitano sia del tag di apertura che del tag di chiusura - come fanno la maggior parte degli elementi - sono ul, ol e li. Questi elementi vengono usati quando vuoi fare delle liste.

ul è l'abbreviazione delle parole inglesi "unordered list" (lista non ordinata) e inserisce un simbolo per ogni elemento della lista. ol è l'abbreviazione delle parole inglesi "ordered list" (lista ordinata) e numera ogni elemento della lista. Per fare gli elementi delle liste si deve usare il tag li (abbreviazione delle parole inglesi "list item", cioè elemento della lista). Confuso? Guarda l'esempio:

Esempio 7:


 <ul>
   <li>Elemento della lista</li>
   <li>Altro elemento della lista</li>
 </ul>

Si vedrà così nel browser:

Elemento della lista
Altro elemento della lista

Postato sotto: Lezioni HTML