Come Inserire gli Spazi in HTML

2 Parti:Inserire Spazi e Tabulazioni SingoleFormattare Ampie Porzioni di Testo

Quando si compila il codice, tutti i simboli relativi alla spaziatura del testo, inseriti utilizzando la barra spaziatrice, il tasto di tabulazione o il tasto invio, vengono completamente ignorati dal compilatore o dal software in uso. Il linguaggio HTML li interpreta semplicemente come spazi vuoti fra le parole che compongono il testo, quindi provvede e visualizzarli esattamente come appaiono, cioè singoli spazi vuoti. Anche se i fogli di stile CSS permettono di utilizzare uno stile e un layout di pagina più precisi relativi alla spaziatura e all'indentazione del testo, il linguaggio HTML dispone di diversi strumenti per la personalizzazione di questi aspetti.

Parte 1
Inserire Spazi e Tabulazioni Singole

  1. 1
    Inserire uno spazio unificatore. Normalmente, il linguaggio HTML compatta gli spazi multipli in un unico carattere. Digitando il codice   o &# 160; creiamo uno spazio vuoto che verrà sempre visualizzato a video.[1] Ripeti più volte questo codice per creare una stringa di spazi vuoti più ampia. Questo è un esempio di ciò che viene chiamato "entità carattere": un codice che fa riferimento a un carattere o a un simbolo che non può essere digitato direttamente tramite la tastiera del computer.
    • Questo carattere speciale viene chiamato "spazio unificatore" perché non indica la fine della linea e impedisce il conseguente ritorno a capo. Utilizzando eccessivamente tale simbolo i browser avrebbero delle difficoltà a inserire correttamente le interruzioni al termine delle linee di testo nel tentativo di renderlo ordinato e leggibile.[2]
  2. 2
    Inserisci spazi vuoti di lunghezze differenti. Esistono altri caratteri speciali (entità carattere) in grado di indicare al browser internet di visualizzare uno spazio vuoto. Tuttavia, browser diversi potrebbero interpretare in modo leggermente differente tali entità, ma, a differenza del codice,   in questo caso non dovrebbero influenzare le interruzioni di riga:[3][4]
    •  : prende il nome dal blocco "N" delle presse da stampa. L'entità "en" inserisce uno spazio vuoto pari a circa due caratteri.
    •  : l'entità "em" inserisce uno spazio pari a circa quattro caratteri.
  3. 3
    Simula le tabulazioni utilizzando l'entità carattere spazio unificatore. Se hai la necessità di garantire un'indentazione fissa del testo, e per farlo puoi utilizzare solo codice HTML, l'opzione migliore a tua disposizione consiste nell'utilizzare le diverse entità carattere relative alla spaziatura:     . Limitati però a usare questo metodo solo come ultima risorsa. Consulta il prossimo passaggio se hai la possibilità di utilizzare i fogli di stile CSS: considerati la soluzione più elegante da adottare in questi casi. In alternativa, leggi la sezione relativa alla gestione di ampi paragrafi di testo tramite codice HTML standard.[Image:Insert Spaces in HTML Step 5.jpg|center]]
    • Esiste un carattere che genera lo stesso risultato che si ottiene premendo il tasto Tab (	), ma normalmente non è utile. Il codice HTML standard non prevede l'uso delle tabulazioni, quindi il relativo carattere non esegue alcuna funzione.
  4. 4
    Indentare il testo utilizzando i fogli di stile CSS. Le proprietà "padding" e "margin" dei CSS forniscono al browser istruzioni precise su come visualizzare il contenuto, il risultato che si ottiene è quindi molto più coerente. Anche se non conosci a fondo i CSS e non hai un foglio di stile, implementare una soluzione con questi strumenti non è difficile:[5]
    • All'interno della sezione racchiusa fra i tag <head></head> del tuo documento HTML, inserisci il codice
      <style>p.indent{ padding-left: 1.8em }</style>
      "p.indent" definisce un tipo di paragrafo (p tag) ciamato "indentato" (puoi usare qualsiasi nome). Il resto del codice aggiunge dello spazio bianco alla sinistra di tali paragrafi.
    • Adesso ritorna al corpo del tuo documento HTML. Ogni volta che vuoi indentare un paragrafo, inserisci il codice <p class="indent"></p> tra queste tag.
    • Per definire la giusta quantità di indentatura, modifica il numero "1.8" all'interno del codice CSS. Mantieni la "em" dopo il numero, che è la lunghezza relativa alle dimensioni del carattere in uso.[6]

Parte 2
Formattare Ampie Porzioni di Testo

  1. 1
    Utilizza del testo preformattato. Qualsiasi testi inserito nei tag <pre></pre> dovrebbe venire visualizzato a video esattamente come è stato digitato. Ogni carattere inserito tramite la pressione della barra spaziatrice o del tasto invio dovrebbe venire visualizzato esattamente come avviene in un qualsiasi editor di testo. Puoi utilizzare questa soluzione per visualizzare porzioni di codice di esempio, poesie o qualsiasi altro tipo di testo in cui è fondamentale rispettare la spaziatura, l'allineamento e le interruzioni di riga originali.[7]
    • Un testo preformattato potrebbe utilizzare un tipo di carattere e una dimensione differenti rispetto al normale.
  2. 2
    Crea le interruzioni di riga. Il tag HTML indica al browser che l'attuale linea di testo è terminata. Utilizzando tag multipli, puoi creare sezioni di testo composte esclusivamente da linee vuote. Si tratta di un approccio accettabile se sei alle prime armi con l'utilizzo del codice HTML, ma è una soluzione poco elegante che non dovrebbe essere utilizzata dopo aver imparato a usare i fogli di stile CSS.
  3. 3
    Definisci i tuoi paragrafi di testo usando i tag "p". I tag <p></p> indicano al browser che il testo al loro interno va gestito come un unico paragrafo. La maggior parte dei browser internet separa ogni paragrafo inserendo una linea di testo vuota, ma l'uso di uno stile preciso non è comunque garantito.[8]

Consigli

  • Se durante la verifica dell'aspetto visivo generato dal tuo codice HTML, ti accorgi che sono presenti dei simboli estranei, verifica di non aver inserito dei tag parziali o di averli omessi completamente. Per esempio, potresti aver utilizzato il tag <br anziché <br>.
  • Il fogli di stile CSS sono uno strumento molto più potente e flessibile per la gestione dell'aspetto visivo delle pagine web, incluse la spaziatura e la formattazione del testo.
  • Evita di inserire degli spazi vuoti subito dopo un tag di apertura o prima di un tag di chiusura. Ad esempio, utilizza il codice Tutorial sulla <a>Spaziatura</a> e non Tutorial sulla <a> Spaziatura </a>.[9]

Avvertenze

  • Crea sempre il tuo codice HTML utilizzando un apposito editor per la programmazione o un semplice file di testo. Non utilizzare mai un editor di testo, come ad esempio Word o Writer. Quando, all'interno del browser internet, gli spazi vuoti che hai inserito nel codice vengono rappresentati da simboli strani, significa che molto probabilmente hai usato un editor di testo che ha inserito informazioni aggiuntive riguardanti la formattazione del testo. Tali informazioni non sono adatte per la visualizzazione online.

Informazioni sull'Articolo

Categorie: Internet | Programmazione

In altre lingue:

English: Insert Spaces in HTML, Español: insertar espacios en HTML, Português: Inserir Espaços no HTML, Français: insérer des espaces dans un code HTML, Русский: вставить пробелы в HTML, Deutsch: Leerzeichen in HTML einfügen, 中文: 在HTML中插入空格, Bahasa Indonesia: Menyisipkan Spasi Dalam HTML, Nederlands: Spaties in HTML toevoegen, العربية: إدراج مسافات في لغة اتش تي ام ال, ไทย: เว้นวรรคห่างๆ ใน HTML, 日本語: HTMLでスペースを挿入する, 한국어: HTML에 공백 넣는 방법, Tiếng Việt: Chèn khoảng trống trong HTML

Questa pagina è stata letta 126 605 volte.

Hai trovato utile questo articolo?