CSS’de letter-spacing: kodunun kullanımı

CSS kodları ile yeni yeni tanışmaya başlayan kişilerin karşısına mutlaka çıkacak olan bir css elementidir letter-spacing. Peki bu element ne işe yarar. İsterseniz bunu kullanarak öğrenelim…

İlk olarak elimize bir güzel söz alıyoruz.

Hayat bir tiyatro dediler, bana bir rol verdiler. En acısı benimki idi, önce sev sonra unut dediler..

Gayet normal ve güzel söz. Şimdi bu yazıyı h6 yapalım.

<h6>Hayat bir tiyatro dediler, bana bir rol verdiler. En acısı benimki idi, önce sev sonra unut dediler..</h6>

Yazımız h6 içine girince şu şekli aldı:

Hayat bir tiyatro dediler, bana bir rol verdiler. En acısı benimki idi, önce sev sonra unut dediler..

Şimdi h6 kodumuza CSS ile letter-spacing özelliğini katalım ve ne olacağını görelim.

<style>
h6 {
letter-spacing: 4px;
}
</style>

Yukarıdaki stil kodumuzda letter-spacing kullanarak yazımızdaki harfler arasında 2 pixellik boşluk bıraktık. Kodları bir araya topladığımızda şöyle:

<style>
h6 {
letter-spacing: 2px;
}
</style>

<h6>Hayat bir tiyatro dediler, bana bir rol verdiler. En acısı benimki idi, önce sev sonra unut dediler..</h6>

Ön izlemelerini görmek istediğimizde ise şöyle:

Hayat bir tiyatro dediler, bana bir rol verdiler. En acısı benimki idi, önce sev sonra unut dediler..

bir sonuç elde ettik. Yani kısaca özetlemek gerekir ise; letter-spacing kodu ile harfler arasına boşluk koymaya gerek kalmaksızın aralarını açabiliyor.

Ayrıca letter: harf, spacing ise aralık demek. Böylece 1 yazıda 2 ingilizce kelime öğrenmiş oldunuz. Kod hakkında ayrıntılı bilgi 2. sayfadadır. Güle güle kullanın.