font-synthesis-weight

Baseline 2023

Newly available

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

Die font-synthesis-weight CSS Eigenschaft ermöglicht es Ihnen, festzulegen, ob der Browser einen fetten Schriftschnitt synthetisieren darf, wenn dieser in einer Schriftfamilie fehlt.

Es ist oft praktisch, die Kurzschreibweiseigenschaft font-synthesis zu verwenden, um alle Werte der Schrifttypensynthese zu steuern.

Syntax

css
/* Keyword values */
font-synthesis-weight: auto;
font-synthesis-weight: none;

/* Global values */
font-synthesis-weight: inherit;
font-synthesis-weight: initial;
font-synthesis-weight: revert;
font-synthesis-weight: revert-layer;
font-synthesis-weight: unset;

Werte

auto

Gibt an, dass der fehlende fette Schriftschnitt vom Browser bei Bedarf synthetisiert werden darf.

none

Gibt an, dass die Synthese des fehlenden fetten Schriftschnitts durch den Browser nicht erlaubt ist.

Formale Definition

Anfangswertauto
Anwendbar aufall elements and text. Auch anwendbar auf ::first-letter und ::first-line.
VererbtJa
Berechneter Wertwie angegeben
Animationstypdiskret

Formale Syntax

font-synthesis-weight = 
  auto  |
  none

Beispiele

Deaktivierung der Synthese des fetten Schriftschnitts

Dieses Beispiel zeigt, wie die Synthese des fetten Schriftschnitts durch den Browser in der Montserrat-Schrift deaktiviert wird.

HTML

html
<p class="english">
  This is the default <strong>bold typeface</strong> and
  <em>oblique typeface</em>.
</p>

<p class="english no-syn">
  The <strong>bold typeface</strong> is turned off here but not the
  <em>oblique typeface</em>.
</p>

CSS

css
@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap");

.english {
  font-family: "Montserrat", sans-serif;
}
.no-syn {
  font-synthesis-weight: none;
}

Ergebnis

Spezifikationen

Specification
CSS Fonts Module Level 4
# font-synthesis-weight

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch