Aperfeiçoando o Texto com Utilitários de Tipografia
O Tailwind CSS oferece um conjunto robusto de utilitários para gerenciar tipografia, permitindo controlar facilmente tamanhos de fonte, pesos de fonte e alturas de linha. Esses utilitários ajudam a garantir que o texto seja estilizado de forma consistente e de fácil leitura em diferentes dispositivos e tamanhos de tela.
Tamanho da Fonte
Os utilitários de tamanho de fonte no Tailwind CSS permitem ajustar o tamanho do texto. Esses utilitários seguem uma convenção de nomenclatura que facilita a compreensão e aplicação de diferentes tamanhos.
| Font Size | Description |
|---|---|
text-xs | Extra small text. |
text-sm | Small text. |
text-base | Base text (default size). |
text-lg | Large text. |
text-xl | Extra large text. |
text-2xl, text-3xl, text-4xl, text-5xl, text-6xl | Increasingly larger text sizes. |
index.html
Peso da Fonte
As utilidades de peso da fonte controlam a espessura ou intensidade do texto. O Tailwind CSS oferece diversas utilidades para abranger uma ampla variedade de pesos de fonte, desde o mais fino até o mais intenso.
| Font Weight | Description |
|---|---|
font-thin | Thin font weight. |
font-light | Light font weight. |
font-normal | Normal font weight. |
font-medium | Medium font weight. |
font-semibold | Semi-bold font weight. |
font-bold | Bold font weight. |
font-extrabold | Extra bold font weight. |
font-black | Black font weight. |
index.html
Altura da Linha
As utilidades de altura da linha controlam o espaçamento vertical entre as linhas de texto. Uma altura de linha adequada pode melhorar a legibilidade e a aparência visual geral dos blocos de texto.
| Line Height | Description |
|---|---|
leading-none | No line height. |
leading-tight | Tight line height. |
leading-snug | Snug line height. |
leading-normal | Normal line height. |
leading-relaxed | Relaxed line height. |
leading-loose | Loose line height. |
leading-3, leading-4, leading-5, etc. | Specific numeric line height. |
index.html
Nota
Para obter informações específicas sobre tamanho da fonte, peso da fonte ou altura da linha, acesse os seguintes links:
1. Qual classe deve ser utilizada para definir o tamanho da fonte como extra grande?
2. Qual classe utilitária você usaria para deixar o texto em negrito?
3. Qual classe define o espaçamento entre linhas como relaxado?
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Awesome!
Completion rate improved to 3.57
Aperfeiçoando o Texto com Utilitários de Tipografia
Deslize para mostrar o menu
O Tailwind CSS oferece um conjunto robusto de utilitários para gerenciar tipografia, permitindo controlar facilmente tamanhos de fonte, pesos de fonte e alturas de linha. Esses utilitários ajudam a garantir que o texto seja estilizado de forma consistente e de fácil leitura em diferentes dispositivos e tamanhos de tela.
Tamanho da Fonte
Os utilitários de tamanho de fonte no Tailwind CSS permitem ajustar o tamanho do texto. Esses utilitários seguem uma convenção de nomenclatura que facilita a compreensão e aplicação de diferentes tamanhos.
| Font Size | Description |
|---|---|
text-xs | Extra small text. |
text-sm | Small text. |
text-base | Base text (default size). |
text-lg | Large text. |
text-xl | Extra large text. |
text-2xl, text-3xl, text-4xl, text-5xl, text-6xl | Increasingly larger text sizes. |
index.html
Peso da Fonte
As utilidades de peso da fonte controlam a espessura ou intensidade do texto. O Tailwind CSS oferece diversas utilidades para abranger uma ampla variedade de pesos de fonte, desde o mais fino até o mais intenso.
| Font Weight | Description |
|---|---|
font-thin | Thin font weight. |
font-light | Light font weight. |
font-normal | Normal font weight. |
font-medium | Medium font weight. |
font-semibold | Semi-bold font weight. |
font-bold | Bold font weight. |
font-extrabold | Extra bold font weight. |
font-black | Black font weight. |
index.html
Altura da Linha
As utilidades de altura da linha controlam o espaçamento vertical entre as linhas de texto. Uma altura de linha adequada pode melhorar a legibilidade e a aparência visual geral dos blocos de texto.
| Line Height | Description |
|---|---|
leading-none | No line height. |
leading-tight | Tight line height. |
leading-snug | Snug line height. |
leading-normal | Normal line height. |
leading-relaxed | Relaxed line height. |
leading-loose | Loose line height. |
leading-3, leading-4, leading-5, etc. | Specific numeric line height. |
index.html
Nota
Para obter informações específicas sobre tamanho da fonte, peso da fonte ou altura da linha, acesse os seguintes links:
1. Qual classe deve ser utilizada para definir o tamanho da fonte como extra grande?
2. Qual classe utilitária você usaria para deixar o texto em negrito?
3. Qual classe define o espaçamento entre linhas como relaxado?
Obrigado pelo seu feedback!