Font-size-adjust - CSS-temppuja

Anonim

Tämä ominaisuus antaa kehittäjille mahdollisuuden asettaa font-sizeelementin suurikokoisten kirjainten sijasta isojen kirjainten sijasta.

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

Tässä tapauksessa fontin pienet kirjaimet olisivat 11 kuvapistettä korkeita, koska 22 x, 5 = 11.

Kirjasimia ladattaessa varakirjasimen pienten kirjainten ja vasta ladatun kirjasimen välillä on todennäköisesti erilainen kuvasuhde, joten font-size-adjuston hyödyllistä hallita uudelleenvirtauksen määrää, kun julistamme uuden font-familyja näemme tyylittömän tekstin salaman (FOUT).

Alla olevassa esittelyssä on mahdollista vaihtaa tämä ominaisuus päälle ja pois osoittamaan, kuinka Chaparralin kaltainen verkkofontti eroaa varakirjasimen Times-merkkien x-korkeudesta ja kohdistuksesta. Mutta varokaa, tätä ominaisuutta tukee vain pieni osa selaimista tällä hetkellä.

Tällä voi olla dramaattisia vaikutuksia, kun se asetetaan suurille tekstiosan osille, ja parantaa huomattavasti välkkymistä, joka tapahtuu, kun vaihdetaan varatoiminnon ja vasta ladatun fontin välillä:

Lisää tietoa

  • MDN
  • W3C

Selaimen tuki

Nämä selaintukitiedot ovat Caniuselta, jolla on tarkempia tietoja. Numero osoittaa, että selain tukee ominaisuutta kyseisessä versiossa tai uudemmassa.

Työpöytä

Kromi Firefox IE Reuna Safari
Ei 3 Ei Ei Ei

Matkapuhelin / tabletti

Android Chrome Android Firefox Android iOS Safari
Ei Ei Ei Ei