Come regolare l'interlinea in HTML

I proprietari di piccole imprese con un background di stampa conosceranno il termine lead, che si riferisce alla spaziatura tra le righe di testo. Quando si crea una pagina HTML, l'equivalente dell'interlinea è la proprietà CSS "line-height", utilizzata per impostare la quantità di spazio tra ogni riga. L'altezza della linea può essere impostata su un'altezza fissa, ad esempio 12 pixel, o come percentuale della dimensione del carattere, ad esempio 120 percento. L'impostazione del valore su "normale" ripristina l'interlinea al valore predefinito.

1

Apri un'applicazione di progettazione Web o un editor di testo e crea una nuova pagina HTML o aprine una esistente.

2

Aggiungere il seguente codice al corpo della pagina Web:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris condimentum pulvinar pulvinar. Suspendisse eros nulla, sodales ut tincidunt sit amet, facilisis id dui. Donec pharetra euismod mattis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

3

Aggiungi il seguente foglio di stile CSS alla sezione della pagina:

Questa regola CSS si applica al div con l'ID "exampleText", impostando la larghezza a 400 pixel e la dimensione del carattere a 14 pixel, visualizzando il paragrafo di testo su un numero di righe. Salvare la pagina e quindi aprirla in un browser Web per visualizzare il risultato.

4

Aggiungi la seguente nuova regola CSS al foglio di stile nella pagina:

altezza della linea: 200%; 

}

Questa regola cambierà l'interlinea del paragrafo al 200% della dimensione del carattere, in questo caso 28 pixel. Se la dimensione del carattere cambia, l'interlinea cambierà automaticamente in modo proporzionale. Salvare la pagina e ricaricare nel browser Web per vedere l'effetto della proprietà di interlinea.

5

Modificare l'impostazione dell'altezza della linea su 20 pixel, come segue:

line-height: 20px; 

}

Imposta una spaziatura costante di 20 pixel tra le righe di testo, indipendentemente dalla dimensione del carattere del testo. Salva la pagina e aggiorna nel browser per vedere la nuova interlinea.


$config[zx-auto] not found$config[zx-overlay] not found