Durante la creazione di pagine Web e la programmazione in HTML, potresti aver notato che non importa quanti spazi inserisci tra parole o elementi di testo vengono compressi in un singolo spazio durante il rendering della pagina.
Quando si scrive testo o frasi nella maggior parte dei software di elaborazione del testo, si sarà in grado di colpire la barra spaziatrice più volte e aggiungere più spazi dove vuoi., A seconda dell’editor HTML che stai utilizzando, potresti essere in grado di farlo anche nell’editor, ma non appena la pagina viene visualizzata in un browser Web quegli spazi scompaiono.
Questo può essere davvero fonte di confusione per i nuovi utenti e programmatori alle prime armi. Guardi il codice sorgente e vedi gli spazi multipli ma in qualche modo la pagina web non ce l’ha. Ciò è dovuto al funzionamento delle specifiche HTML e alla programmazione dei motori di rendering. Ma non tutto è perduto….,
spazi tra parole o caratteri in elementi di testo
Per inserire più spazi, è necessario conoscere il carattere HTML esteso: o il carattere spazio non-breaking. È possibile utilizzare questi per aggiungere uno spazio extra quasi ovunque ti piace. Diamo un’occhiata ad un esempio:
<p>this is a short sentence with extra spaces between text</p>
L’esempio precedente mostrerà o renderizzerà nel browser Web come:
questa è una breve frase con spazi extra tra il testo
Puoi usarlo tra qualsiasi elemento e con qualsiasi tag HTML., Qui abbiamo usato il tag<p> o paragrafo, ma è possibile utilizzarlo anche all’interno di div o span. Questo è utile per aggiungere spazi orizzontali tra parole e caratteri. Se stai pensando di aggiungere spazio verticale tra parole o frasi, allora si chiama altezza della linea e l’altezza della linea può essere personalizzata in modi completamente diversi.,
usando i css per aggiungere spaziatura delle parole
Il metodo sopra riportato di usare il carattere spazio non-breaking è probabilmente l’approccio più flessibile in quanto ti dà la possibilità di inserire casualmente spazi dove vuoi. Questo è tutto buono e bene quando si aggiungono solo alcuni spazi qua e là. Ma se vuoi aggiungere costantemente spazi extra tra ogni parola nell’intero elemento di testo, allora può diventare piuttosto ingombrante.
Quindi per farlo con questo metodo dovrai aggiungere il carattere di spazio non-breaking tra ogni singola parola nel testo., L’altra opzione è utilizzare la proprietà CSS per la spaziatura delle parole. La proprietà CSS è denominata word-spacing e può essere utilizzata con qualsiasi tag HTML che visualizza il testo.
<p style=”word-spacing: 40px”>this is a sample sentence with extra wide word spacing between text</p>
Il codice di cui sopra verrà eseguito il rendering, come:
questo è un esempio di frase con possibilità di ampia spaziatura tra parole
spazi tra i paragrafi o altri elementi di testo della pagina
anche se è un brutto modo per raggiungere questo obiettivo, è possibile aggiungere il non-breaking space ( ) per aggiungere spazi tra i paragrafi, come pure. Il modo migliore per farlo sarebbe usare un foglio di stile a cascata o il tag di stile.,
Quindi, il primo metodo per aggiungere lo spazio tra due paragrafi sarebbe quello di aggiungere un nuovo paragrafo vuoto tra di loro. È possibile ottenere ciò utilizzando i caratteri di spazio non interrompibili con i tag P.
<p>first paragraph here</p>
<p> </p>
<p>second paragraph</p>
È possibile aggiungere tanti di questi paragrafi “extra” come è necessario aggiungere spazio tra i paragrafi. Un’opzione leggermente migliore è usare il tag di interruzione di riga in HTML ,che è il tag<br>.,
<p>first para</p>
<br/><br/>
<p>second para</p>
È possibile aggiungere tutti i tag br che si desidera aggiungere spazio verticale tra testo o blocchi visivi in HTML. E il modo migliore è usare il tag di stile o CSS e regolare il margine o il padding dell’elemento. Come farlo è probabilmente oltre lo scopo di questo post<