Atributo CSS line-height

Definição e uso

A propriedade line-height define o espaço entre as linhas (altura da linha).

Nota:Não é permitido usar valores negativos.

Descrição

Esta propriedade afeta o layout do contêiner de linha. Quando aplicada a um elemento de bloco, ela define a distância mínima entre as linhas de base do elemento, em vez da distância máxima.

A diferença entre o valor calculado de line-height e font-size (conhecido como 'espaçamento entre linhas' no CSS) é dividida em duas metades, adicionadas à parte superior e inferior do conteúdo da linha de texto. O contêiner mais pequeno que pode conter esses conteúdos é o contêiner de linha.

O valor numérico original especifica um fator de escala, e os elementos descendentes herdarão esse fator de escala em vez do valor calculado.

Veja também:

Tutorial de CSS:Texto CSS

Manual do HTML DOM:Propriedade lineHeight

Exemplo

Definir a altura da linha em porcentagem:

p.small {line-height:90%}
p.big {line-height:200%}

Experimente você mesmo

(Mais exemplos podem ser encontrados na parte inferior da página)

Sintaxe do CSS

line-height: normal|number|length|initial|inherit;

Valor da propriedade

Valor Descrição
normal Padrão. Definir um espaçamento entre linhas razoável.
number Definir um número, que será multiplicado pelo tamanho atual da fonte para definir o espaçamento entre linhas.
length Definir um espaçamento entre linhas fixo.
% Porcentagem do espaçamento entre linhas baseada no tamanho atual da fonte.
inherit Define que o valor da propriedade line-height deve ser herdado do elemento pai.

Detalhes técnicos

Valor padrão: normal
Herança: sim
Versão: CSS1
Sintaxe do JavaScript: object.style.lineHeight="2"

Exemplo TIY

Definir o espaçamento entre linhas usando porcentagens
Este exemplo demonstra como usar porcentagens para definir o espaçamento entre linhas do parágrafo.
Definir o espaçamento entre linhas usando valores em píxeis
Este exemplo demonstra como usar valores em píxeis para definir o espaçamento entre linhas do parágrafo.
Definir o espaçamento entre linhas usando um número
Este exemplo demonstra como usar um número para definir o espaçamento entre linhas do parágrafo.

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0