Heim >Web-Frontend >CSS-Tutorial >Kann ich mehrere Schriftstärken mit einer einzigen @font-face-Abfrage importieren?
Abfragen mehrerer Schriftstärken mit @font-face
In der Situation, in der mehrere Schriftvarianten mit unterschiedlichen Stärken und Stilen verfügbar sind, wie z Für die erwähnte Klavika-Schriftart ist es natürlich zu fragen, ob es möglich ist, diese Importe in einer einzigen @font-face-Abfrage zu konsolidieren, um Wiederholungen zu vermeiden Kopieren.
Die Antwort liegt in einer speziellen Form von @font-face, mit der Sie die Schriftstärke innerhalb der Abfrage selbst definieren können.
Zum Beispiel, um die Klavika-Familie mit verschiedenen Strichstärken und Stilen zu importieren , können Sie Folgendes verwenden:
@font-face { font-family: "Klavika"; src: url("Klavika-Regular.otf") format("truetype") weight:normal; src: url("Klavika-Bold.otf") format("truetype") weight:bold; src: url("Klavika-Regular-Italic.otf") format("truetype") weight:normal style:italic; src: url("Klavika-Bold-Italic.otf") format("truetype") weight:bold style:italic; }
Dieser Ansatz bietet die Möglichkeit, die Schriftstärke oder den Schriftstil für jedes Element anzugeben, ohne dass die Schriftfamilie oder explizit deklariert werden muss Überschreiben Sie zuvor festgelegte Schriftstärke und -stil. Zum Beispiel:
body { font-family:"Klavika", Georgia, serif; } h1 { font-weight:bold; } em { font-style:italic; } strong em { font-weight:bold; font-style:italic; }
Das obige ist der detaillierte Inhalt vonKann ich mehrere Schriftstärken mit einer einzigen @font-face-Abfrage importieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!