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.

2
Bir yorum yap yada bir soru sor.

avatar
2 Yorum konuları
0 Konu cevapları
0 Takipçiler
 
En çok beğenilen yorum dizilişi
En iyi yorum dizilişi
2 Yorum yazarları
ishanaHakan Solmaz Son yorum yazarları
  Yorumlara Abone Ol  
Önce Yeniler Önce Eskiler Önce Beğenilenler
Bildir
Hakan Solmaz
Hakan Solmaz

Blogum’da logo kullanmıyorum. H etiketiyle ve yazı tipiyle logo yerine kullanıyorum. Letter-spacing kodu sayesinde logo kıvamında duruyor. Güzel kod teşekkürler Murat Abi.

ishana
ishana

CSS kodlarının detaylı anlatımı için teşekkürler. Müşterilerin istediği bazı yazı fontlarında yine müşterinin istediği etkiyi bırakabilmek için sıklıkla başvurduğum bir uygulama. Her ne kadar bilişim dili İngilizce olsa da kendi dilimizde bilgi kaynağı olacak siteler oldukça az. Girişiminizi destekliyorum. CSS web sayfalarının makyajıdır. CSS bilmeyen bir tasarımcı kendisine web tasarımcıyım demesin.