Bolehkah Anda Menentukan Berat Berbilang Font dalam Pertanyaan @font-face Tunggal?

Bolehkah Berbilang Berat Font Ditakrifkan dengan Pertanyaan @font-face Tunggal?

Fon Klavika datang dalam pelbagai berat dan bentuk. Bolehkah ini diimport ke dalam CSS dengan pertanyaan @font-face tunggal yang menentukan berat?

Penyelesaian:

Memperkenalkan ciri serba boleh @font-face, anda boleh mengaitkan gaya dan berat yang berbeza dengan satu nama keluarga fon:

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

Anda kini boleh menentukan font-weight:bold atau font-style:italic untuk elemen yang berbeza:

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

h1 { font-weight:bold; }

em { font-style:italic; }

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

Untuk butiran komprehensif tentang ciri ini, rujuk dokumentasi rasmi.

Contoh:

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

Atas ialah kandungan terperinci Bolehkah Anda Menentukan Berat Berbilang Font dalam Pertanyaan @font-face Tunggal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!