Forbedring av Tekst med Typografi-Verktøy
Tailwind CSS tilbyr et omfattende sett med verktøy for håndtering av typografi, slik at du enkelt kan kontrollere skriftstørrelser, skriftvekter og linjeavstander. Disse verktøyene bidrar til å sikre at teksten din er konsekvent formatert og lett å lese på ulike enheter og skjermstørrelser.
Skriftstørrelse
Verktøy for skriftstørrelse i Tailwind CSS gjør det mulig å justere størrelsen på teksten. Disse verktøyene følger en navnekonvensjon som gjør det enkelt å forstå og bruke ulike størrelser.
| 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
Skriftvekt
Skriftvekt-verktøy styrer tykkelsen eller fetheten på teksten. Tailwind CSS tilbyr flere verktøy som dekker et bredt spekter av skriftvekter, fra tynn til svart.
| 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
Linjeavstand
Linjeavstandsverktøy styrer den vertikale avstanden mellom tekstlinjer. Korrekt linjeavstand kan forbedre lesbarheten og det visuelle uttrykket til tekstblokker.
| 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
Merk
Hvis du trenger spesifikk informasjon om skriftstørrelse, skriftvekt eller linjehøyde, vennligst klikk på følgende lenker:
1. Hvilken klasse brukes for å angi skriftstørrelse til ekstra stor?
2. Hvilken hjelpeklasse bruker du for å gjøre teksten fet?
3. Hvilken klasse setter linjehøyden til å være avslappet?
Takk for tilbakemeldingene dine!
Spør AI
Spør AI
Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår
Awesome!
Completion rate improved to 3.57
Forbedring av Tekst med Typografi-Verktøy
Sveip for å vise menyen
Tailwind CSS tilbyr et omfattende sett med verktøy for håndtering av typografi, slik at du enkelt kan kontrollere skriftstørrelser, skriftvekter og linjeavstander. Disse verktøyene bidrar til å sikre at teksten din er konsekvent formatert og lett å lese på ulike enheter og skjermstørrelser.
Skriftstørrelse
Verktøy for skriftstørrelse i Tailwind CSS gjør det mulig å justere størrelsen på teksten. Disse verktøyene følger en navnekonvensjon som gjør det enkelt å forstå og bruke ulike størrelser.
| 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
Skriftvekt
Skriftvekt-verktøy styrer tykkelsen eller fetheten på teksten. Tailwind CSS tilbyr flere verktøy som dekker et bredt spekter av skriftvekter, fra tynn til svart.
| 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
Linjeavstand
Linjeavstandsverktøy styrer den vertikale avstanden mellom tekstlinjer. Korrekt linjeavstand kan forbedre lesbarheten og det visuelle uttrykket til tekstblokker.
| 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
Merk
Hvis du trenger spesifikk informasjon om skriftstørrelse, skriftvekt eller linjehøyde, vennligst klikk på følgende lenker:
1. Hvilken klasse brukes for å angi skriftstørrelse til ekstra stor?
2. Hvilken hjelpeklasse bruker du for å gjøre teksten fet?
3. Hvilken klasse setter linjehøyden til å være avslappet?
Takk for tilbakemeldingene dine!