Il World Wide Web Consortium raccomanda la separazione degli elementi della struttura e presentazione di una pagina Web. Quando sono mescolati, la pagina è difficile da aggiornare e ancora più difficile da analizzare dai motori di ricerca che stanno cercando di vagliare contenuto reale dai contenitori. È possibile utilizzare i fogli di stile (CSS) per descrivere la presentazione delle pagine Web. Questo include i colori, il layout e font. Se si desidera aumentare la spaziatura orizzontale a CSS, è possibile specificare lo spazio tra i caratteri, parole o righe.

istruzione

1 Aprire il foglio di stile esterno o individuare la sezione stili nella sezione head della pagina Web. Aggiungere "letter-spacing: 2px;" a un tag HTML specifico o come classe.

Esempio specifico tag:

h1 {letter-spacing: 1px;}

Esempio di classe:

.widespacing

{Letter-spacing: 3px;}

Il primo esempio aggiungerà leggero spazio tra ogni carattere per ogni H1 rubrica nella pagina Web. Il secondo esempio aggiungerà tre volte tanto spazio per ogni elemento HTML che si assegna la classe. <P class = "widespacing"> Questo testo avrà ampia spaziatura quando visualizzato in un browser. </ P>

2 Aggiungere "word-spacing: 10px;" al tuo foglio di stile per mettere spazio tra le parole - spaziatura dei caratteri rimane al default. Questo stile può essere specifico tag o uno stile personalizzato utilizzato per più elementi HTML.

Esempio specifico tag:

blockquote {word-spacing: 15px;}

Esempio di classe:

.widewordspacing

{Word-spacing: 30px;}

esempio di utilizzo Classe:

<P class = "widewordspacing"> Questo testo visualizzerebbe con le parole normalmente distanziati che hanno un sacco di spazio tra loro. </ P>

3 Aggiungere "line-height: 150%;" al vostro foglio di stile, se si vuole aumentare la quantità di spazio tra le righe. (150 è solo un esempio, regolare in base alle proprie preferenze.) Secondo W3Schools, l'altezza della linea di default di maggior parte dei browser è di 110 a 120 per cento.

Esempio specifico tag:

li {line-height: 175%;}

Esempio di classe:

.extralinespacing

{Line-height: 200%;}

esempio di utilizzo Classe:

<P class = "extralinespacing"> Questa frase visualizza normalmente tranne che se si dispone alla riga successiva ci sarebbe il doppio dello spazio come al solito tra la prima e la seconda linea. </ P>