Css Metin ve Yazıtipi Özellikleri

Css'nin temel taşlarından birisi olan "yazıtipi" konusunu dilimin döndüğünce anlatmaya çalışacağım. Font üzerine birçok özellik bulunmakta bunları bilmek bize çok şey kazandıracaktır, hem kullanım hemde uygulama açısından o yüzden temel taşlarından birisidir cssnin font özellikleri. Fazla vakit kaybetmeden giriş yapalım.

Metin ve Yazıtipi Özellikleri

font-family
font-size
font-style
font-weight
font-variant
text-transform
text-decoration (yazının altında-üstünde çizgi olması, değerler; none, underline, overline, line-throught, blink.)
text-align (yazının konumu, değerler; left, right,center,justify)
text-indent (paragraf boşluğu, değerler; px, em, pt, cm, %...)
letter-spacing (harfler arası uzaklık, değerler; normal yada px, em ...)
word-spacing (kelimeler arası uzaklık. değerler; normal yada px, em vs..)
vertical-align (H2O'daki 2nin aşağıda vs olmasını ayarlar. değerler; basaline, sub, super, top, text-top, middle, bottom, text-bottom)
line-height (satırlar arası boşluk, değerler; normal yada px, em, mm vs..)

Font Family ( Yazı Tipi )

generic-family font ailesinin isimlerini liste halinde yazacak olursak;

serif (örn: Times)
sans-serif (örn: Arial yada Helvetica)
cursive (örn: Zapf-Chancery)
fantasy (örn: Western)
monospace (örn: Courier)

Metinlerin kullanılacağı font ailesini belirlemek için kullanılır. Birden fazla font ailesi kullanılacaksa aralarına virgül (,) konur. Genelde son font ailesi olarak soysal font ailesi yazılır.

a {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

Eğer font ismi birden fazla kelimeden oluşuyorsa tırnak içinde kullanmak zorundayız.

p {
font-family: Arial, "Times New Roman", serif;
}

Font Size ( Yazı Büyüklüğü )

Yazı büyüklüğünü ayarlarken kullanacağımız tanımlamadır, cssde font büyüklük tanımı yaparken bir çok birim kullanabilirsiniz. (px, pt, cm, mm, em, ex, pc, inc ve %)

p {font-size: 14px}
p {font-size: 2.6em}
p {font-size: 77%}
p {font-size: 10cm}

Font Style ( Yazı Stili )

Yazı tipimizi şekillendirmek stil vermek için kullandığımız tanımlamadır, yatık yada düz olarak kullanma şekli bulunmaktadır. Aldığı değerler ise; normal, italic, oblique, inherit.

h1 {font-style: italic}
h2 {font-style: normal}
h3 {font-style: oblique}

Font Weight ( Yazı Kalınlığı )

Yazının kalınlığı ayarlamak için kullandığımız bir tanım olmakla beraber 100'den 900'e kadar bir değer alabilir yada normal, bold, bolder, lighter gibi değerlerde alabilmektedir.

p {font-weight: lighter}