font-weight adalah property CSS untuk menentukan tebal (boldness) dari teks. Namun, tebal yang bisa diberlakukan pada teks juga tergantung dari font-family yang digunakan untuk halaman web. Terkadang, teks hanya bisa diatur dengan tebal normal atau bold saja. Adapun sintaks property font-weight CSS adalah sebagai berikut:
font-weight: normal|bold|bolder|lighter|number|initial|inherit;
Dari sintaks di atas, nilai (value) dari property font-weight adalah normal, bold, bolder, lighter, number, initial atau inherit. Bila Anda menentukan nilai property font-weight dengan number, Anda bisa menggunakan salah satu nilai dari 100, 200, 300, 400, 500, 600, 700, 800 atau 900. Nilai 400 sama dengan normal dan 700 sama dengan bold. Nilai initial mengatur property font-weight ke nilai default dan inherit mewarisi dari elemen atau tag di atasnya.
Contoh berikut ini beberapa nilai dari property font-weight CSS. Anda dapat melihat perubahan tampilan teks untuk masing-masing nilai:
<!DOCTYPE html>
<html>
<head>
<title>Membuat teks tebal (bold) dengan CSS</title>
<style type="text/css">
.normal { font-weight: normal; }
.bold { font-weight: bold; }
.number100 { font-weight: 100; }
.number200 { font-weight: 200; }
.number300 { font-weight: 300; }
.number400 { font-weight: 400; }
.number500 { font-weight: 500; }
.number600 { font-weight: 600; }
.number700 { font-weight: 700; }
.number800 { font-weight: 800; }
.number900 { font-weight: 900; }
</style>
</head>
<body>
<h2>Property font-weight CSS</h2>
<p class="normal">Teks ini diatur dengan font-weight: normal</p>
<p class="bold">Teks ini diatur dengan font-weight: bold</p>
<p class="number100">Teks ini diatur dengan font-weight: 100</p>
<p class="number200">Teks ini diatur dengan font-weight: 200</p>
<p class="number300">Teks ini diatur dengan font-weight: 300</p>
<p class="number400">Teks ini diatur dengan font-weight: 400</p>
<p class="number500">Teks ini diatur dengan font-weight: 500</p>
<p class="number600">Teks ini diatur dengan font-weight: 600</p>
<p class="number700">Teks ini diatur dengan font-weight: 700</p>
<p class="number800">Teks ini diatur dengan font-weight: 800</p>
<p class="number900">Teks ini diatur dengan font-weight: 900</p>
</body>
</html>
Kursus LPIA:
Segera bergabung : - kursus bahasa Inggris - kursus komputer dengan: Lembaga Pendidikan Indonesia Amerika ( LPIA ); Alamat LPIA Margonda Jl. Margonda Raya, No.91C (dekat lampu merah flyover pertigaan Arief Rahman Hakim atau depan Autopart Ramanda Depok, sebelah Solite Furniture dan ATTIN TOUR); Kelurahan: Pancoran Mas; Kecamatan : Pancoran Mas; Kota: Depok; Po Box: 16431; Telepon LPIA Depok : (021) 7774443