Typography özelliği, web sayfalarında kullanılan yazıların stil, boyut, renk, satır aralığı, yazı tipi vb. özelliklerini belirlememizi sağlar. Bu özellik sayesinde, metinler daha okunaklı, güzel ve dikkat çekici hale getirilebilir.
Font-size özelliği, metin boyutunu ayarlar. Font-family özelliği, metnin yazı tipini belirler. Color özelliği, metne bir renk atar. Line-height özelliği, metnin satır aralığını kontrol eder. Text-align özelliği, metnin hizalamasını sağlar.
Aşağıdaki kod blokları, Typography özelliği için bazı örnekler içermektedir:
<h1 class="font-example">Bu bir başlık etiketidir</h1>
<p class="text-example">Bu bir paragraf etiketidir.</p>
.font-example {
font-size: 36px;
font-family: Arial, sans-serif;
color: #333;
line-height: 1.2;
text-align: center;
}
.text-example {
font-size: 16px;
font-family: Georgia, serif;
color: #666;
line-height: 1.5;
text-align: justify;
}
Yukarıdaki kod bloklarında, her bir HTML etiketi için farklı CSS stiller tanımlanmıştır. Font-size özelliği (font-size) ile yazı boyutu ayarlanırken, font-family özelliği (font-family) ile yazı tipi belirlenmiştir. Color özelliği (color), metne renk sağlarken, line-height özelliği (line-height) ile satır aralığı kontrol edilmiş ve Text-align özelliği (text-align) ile metin hizalanmıştır.
Ayrıca, Google Fonts veya Typekit gibi üçüncü taraf font kaynakları kullanarak, sayfanızda kullanabileceğiniz daha güzel ve dikkat çekici yazı tipleri de seçebilirsiniz.