Pouvez-vous définir plusieurs épaisseurs de police dans une seule requête @font-face ?

Plusieurs épaisseurs de police peuvent-elles être définies avec une seule requête @font-face ?

La police Klavika est disponible en différentes épaisseurs et formes. Peuvent-ils être importés en CSS avec une seule requête @font-face qui spécifie le poids ?

Solution :

En présentant une fonctionnalité polyvalente de @font-face, vous peut associer différents styles et épaisseurs à un seul nom de famille de police :

@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 */
}

Vous pouvez désormais spécifier font-weight:bold ou font-style:italic pour différents éléments :

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

h1 { font-weight:bold; }

em { font-style:italic; }

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

Pour des détails complets sur cette fonctionnalité, reportez-vous à la documentation officielle.

Exemple :

[Exemple de stylo](https ://codepen.io/anon/pen/EjxVqv)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!