Css font özellikleri bölümünde yazı tipi, yazının kalınlığı, yazı boyutu, yazının eğikliği vb. gibi işlemleri yapmak için css font özellikleri kullanılmaktadır.
Css font özellikleri şunlardır:
Css font-family özelliği yazı tipini belirlemek için kullanılmaktadır. Css font ailesi isminden de anlaşıldığı üzere bu özelliğe birden fazla değer girilebilmektedir. Birden fazla değer girildiğinde ilk değer tarayıcı tarafından destekleniyorsa ilk yazı tipi gösterilir, desteklemiyorsa sırasıyla destekleyen yazı tipine kadar gösterir.
<style>
.yazitipi{
font-family:Chiller;
}
</style>
<style>
.yazitipiailesi{
font-family:Arial,"Comic Sans MS","Times New Roman";
}
</style>
Bilgi: Yazı tipi tek olarak belirlenebileceği gibi birden fazla yazı tipide eklenebilmektedir. Eklenen yazı tipleri virgül ile ayrılarak yazılır. Yazı tipi ismi birden fazla kelimeden oluşuyorsa " (çift tırnak) " arasına yazılır.
Css font-size özelliği yazı boyutunu belirlemek için kullanılmaktadır. Yazı boyutu pixel, em, % (yüzde) olarak belirlenebilmektedir.
<style>
.yaziboyutu{
font-size:36px;
}
</style>
Css font-weight özelliği yazının kalınlık incelik değerini belirlemek için kullanılmaktadır. Alabildiği değerler:
<style>
.yazi100{ font-weight:100; }
.yazi200{ font-weight:200; }
.yazi300{ font-weight:300; }
.yazi400{ font-weight:400; }
.yazi500{ font-weight:500; }
.yazi600{ font-weight:600; }
.yazi700{ font-weight:700; }
.yazi800{ font-weight:800; }
.yazi900{ font-weight:900; }
</style>
<style>
p{
font-weight:bold;
}
</style>
<style>
p{
font-weight:normal;
}
</style>
<style>
p{
font-weight:lighter;
}
</style>
Css font-style özelliği yazının eğik, az eğik veya normal olmasını belirlemek için kullanılmaktadır. Css font-style özelliği alabildiği değerler:
<style>
h1{
font-style:normal;
}
</style>
<style>
h1{
font-style:italic;
}
</style>
<style>
h1{
font-style:oblique;
}
</style>
Css font özelliği, tüm font özelliklerinin tek bir özellik altında toplamak yani kısaltmak için kullanılır. Font özelliği ile yazı tipi, yazı boyutu, yazının kalınlığı inceliği ve eğikliğini tek özellik altında belirlemek için kullanılmaktadır.
Css font özelliğini kullanırken aşağıdaki sıralama üzerinden kullanılmaktadır.
Sıralama :
yukarıdaki sıraya göre kullanılmaktadır.
<style>
p{
font: oblique bold 36px/10px Chiller;
}
.uzunhali{
font-style:oblique;
font-weight:bold;
font-size:36px;
line-height:10px;
font-family: Chiller;
}
</style>
Önceki Ders: Css Metin Özellikleri | Sonraki Ders: Css Kenarlık |