Come Inserire gli Spazi in HTML

Questo articolo mostra come inserire spazi vuoti e interruzioni di linea utilizzando il codice HTML. Dato che una serie di spazi vuoti consecutivi all'interno di una pagina HTML viene comunque convertita e visualizzata con un singolo spazio, occorre utilizzare i tag HTML adatti per poter gestire al meglio la spaziatura del testo.

PassaggiModifica

  1. 1
    Usa il carattere speciale "spazio unificatore" (conosciuto anche come "spazio indivisibile" o "spazio insecabile"). Normalmente il browser internet visualizza un singolo spazio vuoto fra le parole di un testo indipendentemente dal numero effettivo di spazi presenti nel codice HTML della pagina. Per forzare la visualizzazione di più spazi vuoti si utilizza il seguente carattere speciale  , che va inserito nel punto in cui occorre visualizzare uno spazio.[1]
    • Per esempio, digitando il codice HTML Ciao   ragazzi! il browser internet, quando lo interpreterà, visualizzerà uno spazio aggiuntivo fra le parole "Ciao" e "ragazzi!".
    • Questo carattere viene chiamato "spazio unificatore" perché impedisce in modo forzato che venga eseguita un'interruzione di riga nel punto in cui è stato inserito. L'utilizzo intensivo di questo carattere speciale è tuttavia sconsigliato perché potrebbe causare dei problemi ai browser internet nell'interpretare e visualizzare correttamente il codice HTML delle pagine web, soprattutto in riferimento alla formattazione del testo e alla gestione delle interruzioni di riga.[2]
    • Per forzare la visualizzazione di uno spazio vuoto puoi anche usare il seguente codice  .
  2. 2
    Inserisci uno spazio vuoto di lunghezza variabile. In HTML è possibile visualizzare una spaziatura fra due parole più lunga del normale utilizzando una delle seguenti opzioni:[3]
    • Per inserire due spazi vuoti digita il carattere speciale  ;
    • Per inserire quattro spazi vuoti digita il codice  ;
    • Per inserire una tabulazione usa la seguente porzione di codice     .
  3. 3
    Formatta l'aspetto dei paragrafi utilizzando i CSS (dall'inglese "Cascading Style Sheets"). Utilizzando i fogli di stile CSS è possibile indicare direttamente al browser la spaziatura e l'ampiezza dei margini da usare, per visualizzare il testo di un paragrafo in modo che risulti più leggibile. Questo metodo è molto più elegante ed efficace rispetto all'utilizzare il carattere speciale  .[4]
    • All'interno della sezione del codice HTML delimitata dai tag <head></head>, inserisci il seguente codice:
      <style>p.indent{ padding-left: 1.8em }</style>
      .
    • Ogni volta che avrai la necessità di indentare un paragrafo all'interno del corpo della pagina HTML in esame dovrai utilizzare il seguente tag:
      <p class="indent"></p>.
    • Per variare l'ampiezza dell'indentazione del testo dovrai modificare il valore "1.8" all'interno del codice CSS. Non eliminare il simbolo "em" dopo il valore numerico, dato che rappresenta l'unità di misura da utilizzare, che in questo caso fa riferimento alla dimensione dei caratteri del testo.[5]
  4. 4
    Inserisci un'interruzione di riga. Digitando il tag HTML <br> dopo una parola, tutto il testo che seguirà verrà visualizzato a partire dalla riga successiva. Se il tag <br> viene inserito all'inizio del testo, verrà visualizzata una riga vuota fra la linea di testo precedente e quella successiva.
    • Per esempio digitando il seguente codice I trichechi sono animali marini<br>dotati di zanne le porzioni di testo "I trichechi sono animali marini" e "dotati di zanne" verranno visualizzate su due righe differenti.
    • Puoi spaziare il testo verticalmente come preferisci inserendo una serie di tag <br>.
  5. 5
    Utilizza i paragrafi se necessario. Se hai bisogno di visualizzare un ampio blocco di testo sotto forma di paragrafo, puoi utilizzare il tag HTML <p> per indicare l'inizio del paragrafo e </p> per indicarne la fine. In questo modo il testo racchiuso all'interno dei tag indicati risulterà visivamente separato dal resto del testo non formattato presente nella pagina.
    • La maggior parte dei browser internet separa i vari paragrafi di testo con una singola linea vuota, tuttavia utilizzando questo tag non è possibile garantire uno stile grafico unico e preciso.[6]
  6. 6
    Utilizza la pre-formattazione del testo per forzare la visualizzazione degli spazi vuoti. In questo modo tutti gli spazi vuoti presenti nel testo verranno visualizzati come tali. Per esempio se in una riga sono presenti quattro spazi, il browser internet visualizzerà esattamente quattro spazi nel punto indicato. Per pre-formattare un testo si usano i tag <pre> e </pre>. Il primo è il tag di apertura che va inserito dove inizia il testo pre-formattato e il secondo è quello di chiusura che va posizionato dove finisce il testo pre-formattato.[7]
    • In questo caso tutti i caratteri relativi alla pressione del tasto Invio presenti nel testo pre-formattato verranno visualizzati come interruzioni di riga.
    Advertisement

ConsigliModifica

  • Per progettare le pagine web e gestirne l'aspetto visivo, inclusa la spaziatura del testo, è meglio utilizzare i CSS che sono uno strumento molto più potente e versatile.
  • Lo "spazio unificatore", rappresentato dal codice HTML &nbsp;, è un esempio di entità speciale che fa riferimento a un carattere che non può essere digitato direttamente tramite la tastiera.
  • Se all'interno delle pagine web che hai creato il browser internet visualizza caratteri o simboli che non dovrebbero apparire, è molto probabile che la causa sia da imputare a dati aggiuntivi inseriti come formattazione del testo da parte dell'editor che hai usato per scrivere il codice che non è adatto per la creazione di documenti HTML. Per ovviare a questo problema usa solo editor di testo che offrono funzionalità basilari come "Blocco note" o "TextEdit".

AvvertenzeModifica

  • Il codice HTML per indicare il tasto Tab è &#09; e non funziona all'interno delle pagine web, come avviene invece nei normali documenti di testo. I documenti HTML standard non riconoscono le tabulazioni, quindi l'utilizzo del carattere per indicare una tabulazione non darà alcun risultato tangibile.
  • Ricorda di scrivere il codice HTML utilizzando sempre un apposito editor per la programmazione oppure un normale editor di testo. Non utilizzare programmi avanzati per la creazione di documenti di testo, come Word o OpenOffice Writer.

Hai trovato utile questo articolo?

No