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; }