Den font-weight
egenskap setter vekt eller tykkelse, av en skrifttype og er avhengig enten av tilgjengelige skrifttyper innenfor en familie skrift eller vekter definert av nettleseren.
span ( font-weight: bold; )
Den font-weight
eiendommen aksepterer enten et søkeord verdi eller forhåndsdefinert numerisk verdi. De tilgjengelige nøkkelordene er:
normal
bold
bolder
lighter
De tilgjengelige numeriske verdiene er:
100
200
300
400
500
600
700
800
900
Nøkkelordverdien normal
tilordnes den numeriske verdien 400
og verdien bold
tilordnes 700
.
For å se noen effekt ved bruk av andre verdier enn 400
eller 700
, må skriften som brukes, ha innebygde ansikter som samsvarer med de spesifiserte vektene.
Hvis en skrift har en fet (“700”) eller normal (“400”) versjon som en del av fontfamilien, vil nettleseren bruke den. Hvis de ikke er tilgjengelige, vil nettleseren etterligne sin egen fete eller normale versjon av skriften. Det vil ikke etterligne de andre utilgjengelige vektene. Skriftene bruker ofte navn som “Vanlig” og “Lys” for å identifisere alternative skriftvekter.
Følgende demo viser bruken av de alternative vektverdiene:
Sjekk ut denne pennen!
Ovennevnte demo bruker gratis font Open Sans, innebygd ved hjelp av Google Web Fonts API. Skriften er lastet med alle tilgjengelige skriftvekter, og ved bruk av font-weight
egenskapen vises de forskjellige tilgjengelige vektene som beskrevet i hvert avsnitts tekst. De utilgjengelige vektene viser bare den logisk nærmeste vekten.
Vanlige skrifttyper som Arial, Helvetica, Georgia, etc. har ikke andre vekter enn 400
og 700
. Så den samme demoen som vises med en av disse skriftene, viser bare to vekter i de ni avsnittene.
Ved hjelp av "dristigere" og "lettere" søkeord
Nøkkelordverdiene bolder
og lighter
er i forhold til den beregnede skriftvekten til det overordnede elementet. Nettleseren vil se etter den nærmeste "dristigere" eller "lettere" vekten, avhengig av hva som er tilgjengelig i fontfamilien, ellers vil den bare velge "400" eller "700", avhengig av hva som gir mest mening.
Underordnede elementer vil ikke arve de "dristigere" og "lettere" søkeordverdiene, men i stedet arve den beregnede vekten.
Nettleserstøtte
Chrome | Safari | Firefox | Opera | DVS | Android | iOS |
---|---|---|---|---|---|---|
Virker | Virker | Virker | Virker | Virker | Virker | Virker |