Ana Sayfa CSS
Kategori:

CSS

İkon Font Kütüphaneleri Oluşturmak

by Sinan BOZKUŞ

Günümüzde popüler olarak kullanılan Font Awesome, Glyphicons kütüphaneleri gibi bir çok font tabanlı ikon kütüphanesi vardır. Sizde kendi hazırladığınız ya da internetten edindiğiniz ikonları font’a çevirerek bir kütüphane oluşturabilir, paket halinde kullanabilirsiniz. İkonlarınızı font haline (yazı tipine) çevirmek için IcoMoon, Fontello, Fontastic, Glyphter gibi servislerden birini tercih edebilirsiniz. Bu yazıda IcoMoon servisini kullanarak kendi fontumuzu oluşturacağız. İhtiyacınız olan en önemli şey .SVG uzantılı vektör ikonlar. Bu ikonları internetten edinebilir, Illustrator vb. vektörel bir çizim programı ile de oluşturabilirsiniz.

Devamını Oku
1 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail

Web Sitelerinizi Farklı Çözünürlüklerde Test Edin

by Sinan BOZKUŞ

google resizer

Bir web sitesi veya web uygulaması geliştirirken yaşanılan en büyük sorunlardan bir tanesi uygulamamızı farklı ekran çözünürlüklerine göre uyarlamak oluyor. Günümüz de yeni yapılan web sitelerinin veya uygulamaların neredeyse tamamı responsive olarak hazırlandığından yayına çıkmadan önce kapsamlı bir test işleminden geçmesi gerekiyor.

Devamını Oku
0 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail

CSS Uppercase Türkçe Karakter Sorunu

by Sinan BOZKUŞ

Css’ de uppercase kullandığınızda küçük “i” karakterleri büyük “I” karakterine dönmektedir. Bunun nedeni Css’in varsayılan olarak İngilizce’ye göre çalışmasıdır. Bu nedenle bir çok kişi uppercase kullanmak yerine kendi methodlarını yazmaktadır.

Aslında bu işlemin çözümü çok çok basit. Yapmamız gereken sayfanın head tagleri arasına sitemizin dilinin Türkçe olduğunu belirten bir tag eklemek.

Örnek:

[html]<meta http-equiv="content-language" content="tr">[/html]

0 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail

Asp.Net Button’u Font Awesome Icon’a Çevirmek

by Sinan BOZKUŞ

fontawesome-aspnet

Msdn forumları, Stack overflow vb. baya araştırmam sonucu yazılan mesajlardan yapılamayacağını öğrendim. Ama yaptım, evet başardım :)

FontAwesome’ı neden button olarak kullanmam gerektiğini merak edenler için; repeater içerisinde ikon olarak kullanıp, tıklandığında itemcommand’ı tetiklemem gerekiyordu. Bunun için bir asp button’una ihtiyacım vardı.

Anlatacaklarım Asp.net WEBFORMS içindir, Asp.net MVC yapısı gereği zaten çok basit bir şekilde kullanılabilmektedir.

Öncelikle button’umuzu button görünümünden kurtarıp metin haline getirmek için aşağıdaki gibi bir css class’ı yazıyoruz.

Devamını Oku
2 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail

TinyPng – Resimlerinizi Kayıpsız Sıkıştırarak Sayfa Boyutlarını Düşürün

by Sinan BOZKUŞ

Web tabanlı bir uygulama veya web sitesi geliştirirken dikkat ettiğimiz kriterlerinin başında sayfalarımızın hızlı açılması gelir. Eğer sayfalarımız geç açılıyorsa hem arama motorları tarafında puanımız düşecek, bu da sıralamamızı etkileyecek, hem de kullanıcılar beklemeyip web sitemizden çıkacaklardır.

Devamını Oku
0 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail

CSS Sıfırlama (CSS Reset)

by Sinan BOZKUŞ

“O da neyin sesi?” diyenler olabilir :)

Örnek vermek gerekirse ne kadar temiz bir css kullanırsak kullanalım hazırladığımız bir tasarım farklı tarayıcılarda farklı farklı gözükebiliyor. Bunun en büyük nedenlerinden biri tarayıcıların kendilerine has varsayılan değerlerinin olmasıdır. (IE ile Firefox’ un default line-height lerinin farklı olması gibi…) CSS sıfırlama işlemi tam da burada imdadımıza yetişiyor ve hazırladığımız tasarımın farklı tarayıcılar üzerinde de tamamen(neredeyse :P) aynı gözükmesini sağlıyor.

Web üzerinde CSS sıfırlama ile ilgili onlarca kaynak ve css kodu bulabilirsiniz. CSS sıfırlama işlemi için bu konuda en popüler olan Eric Meyer tarafından yazılan YUI CSS Reset‘ i tavsiye ederim.

Link: http://meyerweb.com/eric/tools/css/reset/

0 yorum
0 FacebookTwitterPinterestLinkedinWhatsappTelegramEmail