Come Inserire gli Spazi in HTML

Info sull'Autore

Questo articolo spiega come usare e gestire gli spazi vuoti e le interruzioni di riga mediante l'uso del codice HTML. Dato che in HTML la digitazione ripetuta di spazi vuoti tramite la pressione della barra spaziatrice della tastiera non dà il risultato sperato, ma causa semplicemente la visualizzazione di un singolo spazio all'interno del browser internet, per poter gestire la spaziatura del testo occorre utilizzare dei tag HTML specifici.

Metodo 1

Metodo 1 di 3:

Usare il Codice HTML

1
Apri il file HTML da modificare. Puoi aprire un file HTML utilizzando un editor di testo come Blocco note o TextEdit, rispettivamente su Windows e Mac. In alternativa, puoi utilizzare un programma professionale per la creazione di siti web, come Adobe Dreamweaver. Per aprire il documento HTML che vuoi modificare, segui queste istruzioni:
- Accedi alla cartella in cui è memorizzato il file HTML usando la finestra di sistema "Esplora file" su Windows o "Finder" su Mac;
- Seleziona il file HTML con il tasto destro del mouse;
- Posiziona il puntatore del mouse sulla voce Apri con;
- Clicca sul nome del programma che vuoi usare per modificare il documento HTML.
2
Per inserire un normale spazio vuoto premi la Barra spaziatrice della tastiera. Per inserire un semplice spazio vuoto all'interno del testo, clicca sul punto desiderato e premi la barra spaziatrice. Normalmente, in HTML viene visualizzato un singolo spazio fra le parole del testo, indipendentemente dall'effettivo numero di spazi vuoti che sono stati inseriti tramite la pressione della barra spaziatrice.
3
Usa il codice speciale   per inserire e forzare la visualizzazione di uno spazio vuoto aggiuntivo. Questa entità HTML fa riferimento all'acronimo NBSP, che significa "Non Breakable Space"; si chiama così perché non include l'interruzione di riga.^{[1]
X
Fonte di ricerca}
- Per esempio, la stringa di testo Ciao   gente! verrà visualizzata con uno spazio aggiuntivo fra le parole "Ciao" e "gente!" all'interno di un qualsiasi browser internet.
- Abusando nell'uso di questa entità HTML potresti causare dei problemi di visualizzazione al browser internet, dato che non saprà come gestire l'interruzione delle righe e il ritorno a capo del testo in modo che risulti leggibile e ordinato.^{[2]
  X
  Fonte di ricerca}
- Per inserire uno spazio vuoto aggiuntivo puoi anche usare il codice unicode  .
4
Utilizza altre entità HTML per gestire la spaziatura del testo. È possibile inserire più spazi vuoti con una singola entità HTML utilizzando una delle seguenti opzioni:^{[3]
X
Fonte di ricerca}
- Inserisci due spazi vuoti usando il codice HTML &ensp;;
- Inserisci quattro spazi vuoti usando il codice HTML &emsp;;
- Indenta il testo usando il codice HTML     .
Pubblicità

Metodo 2

Metodo 2 di 3:

Usare i Fogli di Stile CSS

1
Apri il documento HTML o il file che contiene il codice CSS. Il codice relativo ai fogli di stile CSS può essere inserito direttamente in un documento HTML all'interno della sezione "head" oppure può essere memorizzato in un file esterno.
- La sezione "head" di un documento HTML è posizionata nella parte superiore del file ed è caratterizzata dai tag "<head>" e "</head>".
2
Crea la sezione in cui inserire il codice CSS. Si tratta della sezione "style" che deve essere posizionata all'interno della sezione "head" del codice HTML oppure in un foglio di stile esterno e separato dal documento HTML. Per creare la sezione "style" all'interno del codice HTML o in un file esterno usa i seguenti tag:
- Digita il tag <style> per indicare l'inizio della sezione "style". Tutto il codice CSS deve essere inserito nel documento dopo questo tag.
- Inserisci il tag </style> per indicare la fine della sezione "style". Tutto il codice CSS che vuoi includere nel codice HTML dovrà essere inserito prima di questo tag di chiusura.
3
All'interno della sezione "style" inserisci i seguenti tag per gestire lo stile del testo: p {indent-text: 5em;}. In questo modo, indicherai a qualsiasi browser internet di indentare il testo usando 5 spazi vuoti dove indicato dal codice HTML.
- Ovviamente, puoi modificare il numero di spazi vuoti da usare per indentare il testo inserendo un valore diverso dopo il parametro "indent-text:".
- Il codice "em" rappresenta l'unità di misura equivalente a un singolo spazio vuoto riferita alla dimensione specifica dei caratteri. Se lo desideri, puoi usare un'unità di misura diversa, per esempio una percentuale ("indent-text: 15%;") o una lunghezza ("indent-text: 3mm;").
4
Digita il tag <p> nel punto in cui vuoi indentare il testo. Devi inserire il tag all'interno della sezione "body" del codice HTML nel punto in cui si trova il testo da indentare. In questo modo, il testo verrà formattato automaticamente in base alle specifiche indicate dal codice CSS.

Pubblicità

Metodo 3

Metodo 3 di 3:

Usare il Tag HTML Pre

1
Apri il file che contiene il codice HTML da modificare. Puoi usare un editor di testo come Blocco note su Windows o TextEdit su Mac. In alternativa, puoi utilizzare un programma professionale per la creazione di siti web, come Adobe Dreamweaver. Per aprire il documento HTML che vuoi modificare segui queste istruzioni:
- Accedi alla cartella in cui è memorizzato il file HTML usando la finestra di sistema "Esplora file" su Windows o "Finder" su Mac;
- Seleziona il file HTML con il tasto destro del mouse;
- Posiziona il puntatore del mouse sulla voce Apri con;
- Clicca sul nome del programma che vuoi usare per modificare il documento HTML.
2
Inserisci il tag HTML <pre> nel punto che precede il testo da formattare. In questo modo verrà creata una sezione di testo preformattato.
3
A questo punto, digita il testo così come vuoi che venga visualizzato subito dopo il tag "<pre>". Creando una sezione di testo preformattato, qualsiasi interruzione di riga o spazio vuoto creato premendo il tasto "Invio" verrà visualizzato correttamente anche all'interno del browser.^{[4]
X
Fonte di ricerca}
4
Inserisci il tag </pre> per indicare la chiusura della sezione di testo preformattato.

Pubblicità

Consigli

Se i caratteri relativi alla spaziatura del testo vengono visualizzati sotto forma di simboli erronei dal browser internet, molto probabilmente sono presenti dei dati aggiuntivi relativi alla formattazione del testo perché è stato utilizzato un editor di testo non adatto alla creazione di contenuti che vanno visualizzati tramite browser internet. Per evitare che ciò si verifichi, crea il tuo codice HTML utilizzando sempre un editor come Blocco note o TextEdit.
I fogli di stile CSS sono uno strumento molto più potente e affidabile per gestire l'aspetto grafico delle pagine web, inclusa la spaziatura del testo.
Il codice HTML   è un esempio di "entità carattere", cioè un codice che fa riferimento a un carattere speciale che non può essere digitato tramite un tasto della tastiera.

Avvertenze

Il codice HTML relativo al carattere associato al tasto Tab ↹ è 	, ma non funziona come si potrebbe pensare. L'interprete del codice HTML non riconosce questo tipo di spaziatura, quindi il carattere relativo alla tabulazione verrà visualizzato come un singolo spazio.
Crea il tuo codice HTML utilizzando sempre un editor apposito per la programmazione oppure salvalo sotto forma di testo semplice (cioè di un file che contenga solo testo e non includa anche le informazioni relative alla formattazione) e non attraverso un editor di testo, per esempio Word.