font-size-adjust

Baseline 2024

Neu verfügbar

Seit Juli 2024 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Vollständige Kompatibilität anzeigen
Mehr erfahren

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,
body,
svg {
  height: 100%;
}

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

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

Browser-Kompatibilität

Siehe auch

CSS font-size-adjust-Eigenschaft

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden