📢 Nuovo Corso Tailwind Completo disponibile!

Elementi HTML

Un elemento HTML è definito da un tag di apertura, del contenuto e un tag di chiusura.

L’elemento HTML comprende tutto dal tag di apertura al tag di chiusura:

<nomeTag>Il contenuto va qui...</nomeTag>

Esempi di alcuni elementi HTML:

<h1>Il mio primo titolo</h1>
<p>Il mio primo paragrafo.</p>

⚠ Alcuni elementi HTML non hanno contenuto (come l’elemento <br>). Questi elementi sono chiamati elementi vuoti. Gli elementi vuoti non hanno un tag di chiusura!

Elementi HTML Annidati

Gli elementi HTML possono essere annidati, cioè gli elementi possono essere contenuti altri elementi.

Tutti i documenti HTML sono costituiti da più elementi HTML nidificati.

L’esempio seguente contiene quattro elementi HTML (<html>, <body>, <h1> e <p>):

<!DOCTYPE html>
<html>
  <body>
    <h1>Il mio primo titolo</h1>
    <p>Il mio primo paragrafo.</p>
  </body>
</html>

Spiegazione dell’esempio

L’elemento <html> è l’elemento radice e definisce l’intero documento HTML.

Ha un tag di apertura <html> e un tag di chiusura </html>.

Quindi, all’interno dell’elemento <html> c’è un elemento <body>:

<body>
  <h1>Il mio primo titolo</h1>
  <p>Il mio primo paragrafo.</p>
</body>

L’elemento <body> definisce il corpo del documento.

Ha un tag di apertura <body> e un tag di chiusura </body>.

Quindi, all’interno dell’elemento <body> ci sono due altri elementi: <h1> e <p>:

<h1>Il mio primo titolo</h1>
<p>Il mio primo paragrafo.</p>

L’elemento <h1> definisce un titolo.

Ha un tag di apertura <h1> e un tag di chiusura </h1>:

<h1>Il mio primo titolo</h1>

L’elemento <p> definisce un paragrafo.

Ha un tag di apertura <p> e un tag di chiusura </p>:

<p>Il mio primo paragrafo.</p>

Elementi HTML Vuoti

Gli elementi HTML senza contenuto vengono chiamati elementi vuoti.

Il tag <br> definisce un’interruzione di riga ed è un elemento vuoto senza tag di chiusura:

<p>
  Questo è un <br />
  paragrafo con una interruzione di riga.
</p>

HTML Non è Sensibile alle Maiuscole

I tag HTML non sono sensibili alle maiuscole: <P> ha lo stesso significato di <p>.