Planos a partir de R$ 39/mês Inscreva-se Agora

1.4 ~ 1.5 Line-Height para definir a altura da linha

1.4 ~ 1.5 Line-Height para definir a altura da linha

Uma altura de linha de 1.4/1.5 X o tamanho do texto, geralmente é o ideal para corpos de texto na web. Considere este tamanho para tipografias semelhantes a Helvetica e Arial.

O que tentamos alcançar com essa regra é um texto que não fique muito grudado e nem muito separado.

See the Pen 77c7d2ca3f6a435a78334ab6a32f3e72 by André | Origamid (@origamid) on CodePen.

Vale lembrar que em títulos essa regra não se aplica. Geralmente quanto maior o tamanho do texto, menor deve ser a razão dele em relação a altura da linha.

Confie nos sites onde passamos a maior parte do nosso tempo como o Google, Facebook e sites de notícias como o Globo.

Essas são as características do corpo de texto destes sites:

Google
Tipografia: Arial
Tamanho: 13px
Line-height: 18px (~ 1.4em)

Facebook
Tipografia: San Francisco
Tamanho: 14px
Line-height: 19px (~ 1.35em)

Globo
Tipografia: Arial
Tamanho: 15px
Line-height: 22px (~ 1.45em)

Confira mais no ebook grátis de Tipografia em:

https://www.origamid.com/books/tipografia-para-web/

Mais Dicas

Código

Dica #01 CSS – box-sizing

Código

CSS @keyframes

Código

HTML – h1 h2 h3 h4 h5 h6

Código

Múltiplos Backgrounds com CSS3

Código

Como adicionar uma barra de loading igual a do YouTube com JavaScript