2

Quando aplico o tamanho de uma fonte através do font-size, sempre fico em dúvida se devo utilizar line-height também. Para a fonte e linha ter o mesmo tamanho. Pois, convenhamos, que fica chato acertar margin e padding se o line-height não está de acordo.

Eu me refiro mais a fontes especificas, aquelas que não são padrões do Windows. Onde utilizo o font-face.

Vocês fazem algo parecido?

1 Resposta 1

5

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?

0

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .