logo Dove iniziare Linguaggi Aiuto Blog
Home Dove iniziare Linguaggi Aiuto e Supporto Info e Blog

I titoli e i paragrafi

Abbiamo visto nella lezione precedente come inserire un semplice testo senza stile. Adesso vediamo come renderlo più bello e come formattarlo a nostra scelta.

I titoli

Per creare dei titoli e dei testi più grandi o più piccoli rispetto a quelli di un testo normale, si utilizzano i tag <h1>, <h2>, <h3>, <h4>, <h5>, ecc. Il tag <h1> crea un testo molto grande, il tag <h2> un testo grande, <h3> medio, <h4> piccolo e così via, fino a <h6>. Dopo la fine di questi tag, il testo andrà a capo da solo.

<!DOCTYPE html>
<html>
  <!-- Il resto della pagina -->
  <body>
    <h1>Il titolo della pagina</h1>
    <h2>Il sottotitolo della pagina</h2>
    <h3>Aumentando il numero dopo h, la grandezza</h3>
    <h4>del testo diminuisce continuamente</h4>
    <h5>fino ad essere molto piccolo</h5>
    <h6>e piccolissimo.</h6>
  </body>
<html>

I paragrafi

Come inserire i paragrafi

Il tag per creare un paragrafo è <p>, in cui all’interno si inserisce il testo che vogliamo:

<!DOCTYPE html>
<html>
  <!-- Il resto della pagina -->
  <body>
    <p>Questo paragrafo contiene un gran numero di parole:
    posso inserire tutto quello che voglio</p>
  </body>
<html>

Come avrai visto, le parole non vanno a capo quando nell’editor di testo si va a campo. Esiste un tag che serve proprio per andare a capo: <br/>. Questo tag particolare non ha un tag di apertura e uno di chiusura, ma è da inserire da solo. Puoi anche scriverlo come <br> o <br />, perché HTML lo leggerà ugualmente.

<!DOCTYPE html>
<html>
  <!-- Il resto della pagina -->
  <body>
    <p>Questo paragrafo contiene un gran numero di parole:<br/>
    posso inserire tutto quello che voglio</p>
  </body>
<html>

Gli stili dei paragrafi

Per dare uno stile ad un testo, per esempio grassetto o corsivo, si utilizzano alcuni tag:

Vediamo un esempio:

<!DOCTYPE html>
<html>
  <!-- Il resto della pagina -->
  <body>
    <p>Questo paragrafo contiene alcuni stili: <br>
    il <b>grassetto</b>, il <i>corsivo</i>, 
    un testo <mark>evidenziato</mark>, un <small>piccolo</small> testo,
    un testo <u>sottolineato</u> e uno <del>cancellato</del>.
    </p>
  </body>
<html>

Esistono altri tag, meno importanti, per dare lo stile al testo:

Prova!Scegli l'opzione corretta tra quelle elencate.
<__>Questo testo è in corsivo</__>
Prova!Completa gli spazi vuoti con il tag appropriato.
<>Questo testo è cancellato<>
Prossima lezione