Yeni TL simgesinin web sitelerinde kullanımı

Şimdi bir çok web tasarımcının ve web programcısının aklında ki soru, yeni TL simgesini web sitelerinde nasıl kullanacakları. Aslında @font-face kullanarak kolayca yeni tl simgesini sitemizde kullanabiliriz.

Yeni TL simgesinin web sitelerinde kullanımı ile ilgili küçük bir örnek :

CSS Dosyanıza aşağıda ki kodları ekleyin… Ayrıca buradan indireceğiniz fontları da font klasörüne kopyalayın (kendinize göre düzenleyebilirsiniz.) http://www.chndkmn.com/download/chndkmn_com_tl_simgesi.zip

@font-face{
font-family: 'AbakuTLSymSansRegular';
src: url('font/abakutlsymsans.eot'),
url('font/abakutlsymsans.eot?#iefix') format('embedded-opentype'),
url('font/abakutlsymsans.woff') format('woff'),
url('font/abakutlsymsans.ttf') format('truetype'),
url('font/abakutlsymsans.svg#AbakuTLSymSansRegular') format('svg');
font-style: normal;
font-weight: normal;
}

Yeni TL simgesinin kullanılacağı html elemanına göre düzenleyeceğiniz CSS kodları :

.TL:before{
font-family: "AbakuTLSymSansRegular", serif;
content:"t";
padding-right:3px;
}

 
HTML sayfasında ki kullanımı :

8.990.000

Demo hazırladığım sayfa : indir

Not : CSS kodlarında küçük bir problem vardı. Erhan beyin uyarısıyla fark edip düzelttim. Ayrıca bir de çalışan demo dosyası ekledim. İndirip kontrol edebilirsiniz.

  1. merhaba dostum bu şekliyle çalışmıyor, bilmediğin konular hakkında neden yazı yazıp başkalarının zamanını alıyorsun!

    1. Erhan bey,
      öncelikle neden böyle bir tepki gösterdiniz anlamadım. Kodlarda bir problem var diye yorum yazsaydınız da zaten ben kontrol ederdim.

      CSS kodlarında “font-family:” satırında fazladan ../ kalmış. Düzelttim. Ayrıca bir de demo dosya ekledim. indirip kullanabilirsiniz.
      İlgiliniz için teşekkür ederim.
      Cihan

    2. Arkadaş doğru ya da yanlış sonuçta iyi niyetle paylaşmış. tepkine bakılacak olursa sanki para verip alıyorsun burdaki bilgileri.

Bir Cevap Yazın

This site uses Akismet to reduce spam. Learn how your comment data is processed.