Line-Height

As classes utilitárias de line-height no WPF permitem ajustar a altura das linhas de texto de forma rápida e consistente. Elas controlam o espaçamento entre linhas, melhorando a legibilidade e a estética do texto em parágrafos, títulos e outros elementos.

Como Funcionam as Classes de Line Height

As classes seguem o padrão lh-[valor][unidade], onde:

• [valor] é um número (inteiro ou decimal) que define o tamanho da altura da linha.

• [unidade] é uma unidade de medida obrigatória: px, rem, em ou %.

Regras CSS Geradas

Cada classe é convertida para a propriedade CSS line-height. Por exemplo:

• lh-20px → line-height: 20px;

• lh-1.5rem → line-height: 1.5rem;

• lh-150% → line-height: 150%;

Como Usar

Aplique as classes diretamente aos elementos HTML, como <p>, <h1>, <li>, etc., para ajustar o espaçamento entre linhas.

Exemplo 1: Texto de Corpo

<p class="lh-1.6rem">
  <!-- Este parágrafo tem uma altura de linha de 1.6rem, ideal para legibilidade em textos longos. -->
</p>

Exemplo 2: Títulos

<h2 class="lh-1.2em">
  <!-- Este título usa uma altura de linha mais compacta, perfeita para textos curtos. -->
</h2>

Notas

• Essas classes exigem uma unidade de medida (px, rem, em, ou %). Valores sem unidade (ex.: lh-1.5) não são suportados por este conjunto de utilitários.