Yazı tipi boyutu ve kalınlığı

font-size ve font-weight özelliklerini öğrenirsin.

Yazı tipi boyutu

Metnin büyüklüğünü font-size özelliği belirler. İki yaygın ölçü türü vardır: piksel (px) sabit bir büyüklük verir; em ise üst öğenin boyutuna göre oran verir.

Örneğin font-size: 16px; her cihazda 16 piksel boy verir. font-size: 1.5em; ise üst öğenin boyutunun 1,5 katı demektir; üst öğe 16px ise sonuç 24px olur.

Üst öğeye göre büyüyen em birimi iç içe geçmiş listede kolaylık sağlar.

Yazı tipi kalınlığı

Yazı tipinin kalınlığını font-weight özelliği belirler. En sık kullanılan iki değer vardır: normal (400) ve bold (700). Daha ince için 100–300, daha kalın için 500–900 arası sayılar da yazılabilir.

Örneğin font-weight: bold; ve font-weight: 700; aynı sonucu verir. Bir başlığı vurgulamak için kalın, dip notu yumuşatmak için ince bir değer seçebilirsin.

Uygulama Başlığı biçimlendir

h1 seçicisi için bir bildirim bloğu aç. İçine font-size: 32px; ve font-weight: bold; bildirimlerini ekle.

Örnek çözümü göster

h1 {
  font-size: 32px;
  font-weight: bold;
}

Kendini test et

Üst öğeye göre büyüt

li {
  font-size: ____;
}

Cevabı göster

li {
  font-size: 1.2em;
}

Hangi font-weight değeri kalın (bold) yazı verir?
- 100
- 300
- 700
- 0
Cevabı göster

700 — Doğru. 700 kalın (bold) değere denk gelir; normal 400'dür.
Birim ve anlamını eşleştir

px

Sabit piksel boyutu
em

Üst öğeye göre oran
%

Kapsayıcıya göre yüzde
rem

Kök öğeye göre oran

Başlığı kalın yap

h1 {
  font-weight: ____;
}

Cevabı göster

h1 {
  font-weight: bold;
}

Sıradaki ders: Satır yüksekliği ve aralık

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler