Font Awesome nedir? nasıl kullanılınır ?

Güncellenme Tarihi : 13 Haziran 2013 İcon set : 3.2.0

Merhaba arkadaşlar,

Öncelikle bu hizmeti bize sunan arkadaş 27″ lik iMac alacakmış ve yardımlarımızı bekliyor, miktarın büyüğü küçüğü olmaz 1 dolarda olsa göndermenizi rica ederim.  ( Destek )

Font Awesome nedir ?

Font Avesome günümüz web sitelerinde çok sık kullanılan iconlardan oluşturulmuş bir fontdur.

Font Awesome nasıl kullanılır ?

Bu iconları web sayfamıza eklemek için 2 işlem yapmalıyız.

1 – “fontAwesome.css” css dosyasını web sitemize eklemek. Burada belirtmek isterim ki css kullanmayanlar için less (Less nedir? nasıl kullanılır ?) veya sass (Sass nedir?) versiyonlarıda mevcuttur.

2 – fontAwesome.css dosyasındaki @font-face olarak belirttiğimiz  fontların konumlarını ayarlamak.

Font Awesome için teknik bilgiler

1- İconların boylarını büyütmek istiyorsanız yapmanız gereken tek şey i tagına önceden tanımlanmış boy class’ları eklemek.  Önceden tanımlanmış boylar (icon-large, icon-2x, icon-3x, icon-4x)

2- İconlara animasyon vermek için yapmanız gereken tek şey i tagına “icon-spin” classını eklemek. Bu özellik ie7,ie8,ie9 tarayıcılarında çalışmamaktadır.

3 – İcon’a border vermek için

Sizlere bir nebze koylaylık olsun diye aşağıda ki ön izleme linkinde Font Awesome’ı gereksiz şeylerden arındırarak bütün iconların isimlerini belirtim.

1 – Font-Awesome – http://fortawesome.github.com/Font-Awesome/
2 – Sass nedir – http://www.gelistiricigunlugu.com/sass-nedir/

“Font Awesome nedir? nasıl kullanılınır ?” üzerine 14 yorum

  1. öncelikle makale için teşekkürler.
    icona renk vermek için ne yapmamız gerektiğinden bahsedebilir misiniz? örneğin benim siyah veya beyaz renkli iconlarım var. ben bordo veya maviye dönüştürmek istiyorum. bunu direk css fontlarını kullanarak yapmanın yolu var mı?

    teşekkürler.

  2. cevap için teşekkürler. peki bu renk verme sadece beyaz renge has bir durum mu yoksa değişik renkteki iconlara verebilir miyiz?

  3. default rengi beyaz olana bordo veya mavi renk atayıp o şekilde gösterdiğimiz gibi defaulr rengi siyah olana da aynı şeyi yapabiliyor muyuz?

  4. merhaba, öncelikle yaptığınız yararlı paylaşımlar için teşekkür ediyorum. Şimdi; tüm iconlarında font awesome kullanılan bir tema var elimde. tema html ve css kullanılarak yazılmış. localde ve sunucuda gayet normal çalışıyor ancak; html kodlarını aspx uzantılı sayfalara gömünce iconlar css’de geçtiği gibi (f0ac) gözüküyor. localde bir sıkıntı yok ama sunucuya atınca hata veriyor. bunun sebebi ne olabilir?

  5. Merhaba Projemde Font Awesome kullandım localde bir sıkıntım yok tüm iconlar çalışıyor ve geliyor, fakat servera attıktantan sonra projemdeki iconlar gelmiyor. yardımcı olursanız sevinirim…

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir