Hvordan bruke line-høyde i CSS

Hvordan bruke line-høyde i CSS


CSS line-height eiendom bestemmer avstanden eller avstanden mellom linjer med tekst på siden. I skriver verden, er denne egenskapen kalles ledende. Finne riktig line-høyde for websiden din kan gjøre en stor forskjell i lesbarhet på siden din. Her er hvordan.

Bruksanvisning

1 Den perfekte line-height vil avhenge av ditt valg av skriftfamilie. I mine eksempler, jeg bruker en sans-serif font. Noen skrifter er "høyere" enn andre. Tahoma ser bra ut på 1,5, men Times Roman kanskje ikke. Vanligvis trenger du ikke ønsker linjene for å være for tett sammen eller for langt fra hverandre. Du vil ha nok plass mellom linjene for å skape maksimal lesbarhet, eller utseendet på enkel lesing. Du ønsker en åpen og innbydende utseende heller enn en "tett" utseende, som fraråder lesing.

2 Line-height kan brukes på en hvilken som helst tekst element, men det er nok best å sette den i CSS-regel for kroppen i stilarket. Alle tekstelementer på siden din vil arve at line-height verdi, som kan justeres ved behov for spesifikke deler av siden.

3 Her er et konkret eksempel på en CSS-regel ved hjelp av line-height:
kropp {
font: 1em / 1.5 Tahoma, Geneva, sans-serif;
}

For å gi deg den samme regelen ikke i CSS stenografi, ville det være:

body {font-size: 1em;
line-height: 1,5;
font-family: Tahoma, Geneva, sans-serif;
}

4 Legg merke til at det ikke er noen enhet koblet til linjehøyde verdi. Ingen px,% eller em enheter skal tildeles den line-height verdi.