font-size-adjust

Baseline 2024
Newly available

Since July 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Das Attribut font-size-adjust ermöglicht es Autoren, einen Aspektwert für ein Element festzulegen, der die x-Höhe der erstgewählten Schriftart in einer Ersatzschriftart beibehält.

Hinweis: Als Präsentationsattribut hat font-size-adjust auch ein entsprechendes CSS-Property: font-size-adjust. Wenn beides angegeben ist, hat das CSS-Property Vorrang.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html
<svg
  width="600"
  height="80"
  viewBox="0 0 500 80"
  xmlns="http://www.w3.org/2000/svg">
  <text y="20" font-family="Times, serif" font-size="10px">
    This text uses the Times font (10px), which is hard to read in small sizes.
  </text>
  <text y="40" font-family="Verdana, sans-serif" font-size="10px">
    This text uses the Verdana font (10px), which has relatively large lowercase
    letters.
  </text>
  <text
    y="60"
    font-family="Times, serif"
    font-size="10px"
    font-size-adjust="0.58">
    This is the 10px Times, but now adjusted to the same aspect ratio as the
    Verdana.
  </text>
</svg>

Nutzungshinweise

Standardwert none
Wert none | <number>
Animierbar Ja
none

Wählen Sie die Größe der Schrift nur basierend auf der Eigenschaft font-size.

<number>

Wählen Sie die Größe der Schrift so, dass ihre Kleinbuchstaben (bestimmt durch die x-Höhe der Schrift) die angegebene Zahl mal der font-size ist.

Die angegebene Zahl sollte im Allgemeinen das Seitenverhältnis (Verhältnis von x-Höhe zu Schriftgröße) der erstgewählten font-family sein. Dies bedeutet, dass die erstgewählte Schriftart, wenn verfügbar, in Browsern gleich groß erscheint, unabhängig davon, ob sie font-size-adjust unterstützen oder nicht.

0 ergibt Text mit null Höhe (versteckter Text).

Spezifikationen

Specification
CSS Fonts Module Level 4
# font-size-adjust-prop

Browser-Kompatibilität

Siehe auch