Skriftstørrelsesjustering - CSS-triks

Anonim

Denne egenskapen gir utviklere muligheten til å angi font-sizeet element avhengig av størrelsen på små bokstaver, i stedet for store bokstaver.

.element ( font-size: 22px; font-size-adjust: .5; )

I dette tilfellet vil små bokstaver i skrifttypen være 11 piksler i høyden, siden 22 x .5 = 11.

Når du laster inn skrifter, vil det sannsynligvis være et annet sideforhold mellom små bokstaver i en reservefont og den nylig lastede skrifttypen, så det font-size-adjuster nyttig å kontrollere mengden av gjennomstrømning når vi erklærer en ny font-familyog ser Flash of Unstyled Text (FOUT).

I demonstrasjonen nedenfor er det mulig å slå denne egenskapen av og på for å vise hvordan en nettfont som Chaparral skiller seg fra x-høyde og justering av tegn i Times, reservesnittet. Men pass på, denne egenskapen støttes for øyeblikket bare av et lite antall nettlesere.

Dette kan ha dramatiske effekter når det settes på store deler av brødtekst, og forbedre flimmeret som oppstår når du bytter mellom reserve og den nylig lastede skrifttypen betydelig:

Mer informasjon

  • MDN
  • W3C

Nettleserstøtte

Disse nettleserstøttedataene er fra Caniuse, som har flere detaljer. Et tall indikerer at nettleseren støtter funksjonen i den versjonen og oppover.

Desktop

Chrome Firefox DVS Kant Safari
Nei 3 Nei Nei Nei

Mobil / nettbrett

Android Chrome Android Firefox Android iOS Safari
Nei Nei Nei Nei