Por mais que os browsers tendam a ter um comportamento considerado padrão, a especificação do line-height
diz que o parâmetro normal
recomendado é de 1.0
a 1.2
, ou seja, pode variar de browser para browser significativamente.
Em outras palavras, é sempre bom determinar o line-height
para que a apresentação das suas páginas seja consistente.
O que você pode levar em consideração é que, quando você especifica a fonte usando a sintaxe composta font
, pode simplificar utilizando apenas uma barra, não precisando de uma diretiva line-height
explícita em separado:
h1 { font: 26px/30px sans-serif }
h2 { font: 20px/20px sans-serif }
p { font: 12px/1.5 sans-serif }
Neste caso, especificamos que a fonte do <p>
tem 12px de altura, e o line-height
equivale a um espaçamento 1.5, ou seja, vai resultar em 18px. Já o <h1>
tem 26px de altura, e 30px de line-height
, assim como o <h2>
terá 20px tanto de altura quanto de distância entre uma linha e outra. Assim, não há necessidade da diretiva line-height
separada em nenhum dos casos.
Interessante notar que o line-height
é uma das propriedades que aceita um valor numérico sem unidade, assim como fizemos com o font
acima. Para especificar um espaçamento 2, basta usar desta forma:
p { line-height: 2 }
Assim, a linha terá o dobro da altura da fonte.
Leitura complementar:
Por que é recomendado utilizar a unidade "em" ao invés de "px" para fontes?