Können Sie mehrere Schriftstärken in einer einzigen @font-face-Abfrage definieren?

Können mehrere Schriftstärken mit einer einzigen @font-face-Abfrage definiert werden?

Die Klavika-Schriftart ist in verschiedenen Stärken und Formen erhältlich. Können diese mit einer einzigen @font-face-Abfrage, die die Schriftstärke angibt, in CSS importiert werden?

Lösung:

Wir stellen Ihnen eine vielseitige Funktion von @font-face vor kann verschiedene Stile und Stärken mit einem einzelnen Schriftfamiliennamen verknüpfen:

@font-face {
  font-family: "DroidSerif";
  src: url("DroidSerif-Regular-webfont.ttf") format("truetype");  /* Normal weight, normal style */
  src: url("DroidSerif-Italic-webfont.ttf") format("truetype"); /* Normal weight, italic style */
  src: url("DroidSerif-Bold-webfont.ttf") format("truetype");  /* Bold weight, normal style */
  src: url("DroidSerif-BoldItalic-webfont.ttf") format("truetype"); /* Bold weight, italic style */
}

Sie können jetzt „font-weight:bold“ oder „font-style:italic“ für angeben verschiedene Elemente:

body { font-family:"DroidSerif", Georgia, serif; }

h1 { font-weight:bold; }

em { font-style:italic; }

strong em {
  font-weight:bold;
  font-style:italic;
}

Ausführliche Details zu dieser Funktion finden Sie in der offiziellen Dokumentation.

Beispiel:

[Beispielstift]( https://codepen.io/anon/pen/EjxVqv)

Das obige ist der detaillierte Inhalt vonKönnen Sie mehrere Schriftstärken in einer einzigen @font-face-Abfrage definieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!