Diese Eigenschaft gibt Entwicklern die Möglichkeit, das font-sizeElement abhängig von der Größe seiner Kleinbuchstaben und nicht der Großbuchstaben festzulegen.
.element ( font-size: 22px; font-size-adjust: .5; )In diesem Fall wären die Kleinbuchstaben der Schrift 11 Pixel hoch, da 22 x 0,5 = 11.
Beim Laden von Schriftarten besteht wahrscheinlich ein anderes Seitenverhältnis zwischen den Kleinbuchstaben einer Fallback-Schriftart und der neu geladenen Schrift. Daher font-size-adjustist es hilfreich, den Reflow zu steuern, wenn wir eine neue deklarieren font-familyund den Flash of Unstyled Text (FOUT) sehen.
In der folgenden Demo können Sie diese Eigenschaft ein- und ausschalten, um zu zeigen, wie sich eine Webschriftart wie Chaparral von der x-Höhe und Ausrichtung der Zeichen in Times, der Fallback-Schriftart, unterscheidet. Beachten Sie jedoch, dass diese Eigenschaft derzeit nur von wenigen Browsern unterstützt wird.
Dies kann dramatische Auswirkungen haben, wenn große Teile des Textkörpers eingestellt werden, und das Flimmern beim Umschalten zwischen Fallback und neu geladener Schriftart erheblich verbessern:
Mehr Informationen
- MDN
- W3C
Browser-Unterstützung
Diese Browser-Unterstützungsdaten stammen von Caniuse, das detaillierter ist. Eine Zahl gibt an, dass der Browser die Funktion ab dieser Version unterstützt.
Desktop
| Chrom | Feuerfuchs | IE | Kante | Safari |
|---|---|---|---|---|
| Nein | 3 | Nein | Nein | Nein |
Handy / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| Nein | Nein | Nein | Nein |