Berat huruf - Trik CSS | CSS Almanac 2025

The font-weightharta menetapkan berat badan, atau ketebalan, fon dan bergantung sama ada di muka font yang ada dalam keluarga fon atau berat ditakrifkan oleh penyemak imbas.

span ( font-weight: bold; )

The font-weightharta menerima sama ada nilai kata kunci atau nilai angka yang telah ditetapkan. Kata kunci yang ada adalah:

normal
bold
bolder
lighter

Nilai angka yang ada adalah:

100
200
300
400
500
600
700
800
900

Nilai kata kunci normaldipetakan ke nilai angka 400dan boldpeta nilai ke 700.

Untuk melihat apa-apa kesan menggunakan nilai selain daripada 400atau 700, font yang digunakan mesti mempunyai terbina dalam muka yang sepadan dengan berat dinyatakan.

Sekiranya font mempunyai versi tebal ("700") atau normal ("400") sebagai bagian dari keluarga font, penyemak imbas akan menggunakannya. Sekiranya tidak tersedia, penyemak imbas akan meniru versi fonnya yang tebal atau normal. Ia tidak akan meniru bobot lain yang tidak tersedia. Fon sering menggunakan nama seperti "Biasa" dan "Ringan" untuk mengenal pasti sebarang bobot fon alternatif.

Demo berikut menunjukkan penggunaan nilai berat ganti:

Lihat Pen ini!

Demo di atas menggunakan font Open Sans percuma, yang disematkan menggunakan Google Web Fonts API. Fon dimuat dengan semua bobot font yang tersedia dan oleh itu, dengan menggunakan sifat font-weighttersebut, bobot yang tersedia berbeda ditunjukkan seperti yang dijelaskan oleh teks setiap perenggan. Berat yang tidak tersedia hanya menunjukkan berat yang paling dekat secara logik.

Fon biasa seperti Arial, Helvetica, Georgia, dan lain-lain tidak mempunyai berat selain 400dan 700. Jadi demo yang sama yang dipaparkan dengan salah satu fon tersebut hanya akan menampilkan dua bobot dalam sembilan perenggan.

Menggunakan kata kunci "lebih berani" dan "lebih ringan"

Nilai kata kunci bolderdan lighterberkaitan dengan berat fon yang dikira bagi elemen induk. Penyemak imbas akan mencari berat "lebih berani" atau "lebih ringan" terdekat, bergantung pada apa yang tersedia dalam keluarga fon, jika tidak, ia hanya akan memilih "400" atau "700", bergantung pada mana yang paling masuk akal.

Unsur anak tidak akan mewarisi nilai kata kunci "lebih berani" dan "lebih ringan", tetapi sebaliknya akan mewarisi berat yang dihitung.