sitemi tarayıcılarda nasil uyumlu yapabiliriz

demek istedigim su ie 6 7 sürümlerinde hersey ic ice giriyor. bunu nasil butun tarayıcılarda uyumlu yapabiliriz. ekran boyutunda site karisiyor. boyutlar degisse bile site ic icer girmesin. herhangi bi kod var mi.

ie - Internet Explorer (All versions)
ie8 - Internet Explorer 8.x
ie7 - Internet Explorer 7.x
ie6 - Internet Explorer 6.x
ie5 - Internet Explorer 5.x
gecko - Mozilla, Firefox (all versions), Camino
ff2 - Firefox 2
ff3 - Firefox 3
ff3_5 - Firefox 3.5
ff3_6 - Firefox 3.6 new
opera - Opera (All versions)
opera8 - Opera 8.x
opera9 - Opera 9.x
opera10 - Opera 10.x


soyle bise yazilmis bu ise yarar mi ?

CSS tarayıcı seçici ( CSS Browser Selector) ne işe yarar?

Siteyi oluştururken tüm stilleri sıfırladık ve kullanıma uygun hale getirdik. Fakat kendi oluşturmuş olduğumuz css kodları yinede farklı tarayıcılarda farklı sonuçlar verebilmektedir. Bu gibi durumlarda imdadımıza CSS Browser Selector yetişiyor ve her tarayıcı için ayrı ayrı style tanımlamaları yapabilmemizi sağlıyor.

Nasıl Kullanılır ?

Öncelikle buradan indireceğiniz css_browser_selector.js (v0.3.4 – 29 eylül 2009) javascript dosyasını, sitenizin dosyaları içine atınız.

Daha sonra web sayfanızın;


...


etiketleri arasına,

<script></script>

kodlarını yapıştırın. Böylece sayfanıza kullanacağımız javascript kütüphanesini yüklemiş oluyoruz…

Artık tek yapmamız gereken CSS bloklarımızı oluştururken, bloğun başında tarayıcı kodunu yazmak.

Basit bir örnekle açıklayalım…

.kutu { border:1px solid #F00; background:#999; padding:5px; }
.ie .kutu { padding:10px; }
.chrome .kutu { border:4px solid #F00; }

Yukarıdaki css kodlarını incelediğimizde, kutu isminde bir class’ımız var.
İlk satırdaki kod bize şunu anlatıyor, bu class’ı atadığımız div’ler kırmızı 1 piksel kenarlıklı, gri zeminli ve 5 piksel iç kenar boşluklu şekilde görünecek. Bu tüm tarayıcılar için geçerlidir.

İkinci satırı incelersek, internet explorer’da kutu class’ı atanmış bu div yukarıdaki özellikleri taşımasının yanı sıra iç kenar boşlukları 5 piksel değilde 10 piksel olacağını görüyoruz.

Üçüncü satırda ise Chrome tarayıcısında kenarlığın 4 piksel genişliğinde olması belirtilmiştir.

Bu gereksiz fazladan kod yazmanızı sağlayan ve sitenize şişiren bir yöntem.Şahsen ie9 altı için bu saatten sonra özel bir şeyler yazmaya gerek yok.

ie9 alti ölsün gitsin diyonuz yani :) peki tesekkürller ozel yapılcak bise yok yani herhangi bi eklenti veya js css ?

sana önereceği tek kod şudur :)













cevabınız icin tskler. verdiginiz kodlari nereyye ekliyeyim ? bide arada yazı var aciklama onuda ekliyeyim yoksa aradan cikartayim mi ? cikarilsa nasil olur onu bidaha atarmisiniz size zahmet. yoksa direk yazsamda olur mu

Ek Olarak: simdi anladim tamam tesekkürler. yeni uyandim okudum anlamamistim. verdiginiz kodlari sitenin neresine yerlestirmem gerekiyor ?

ie9 öncesi için uğraşmayın bence boşa emek harcarsınız

evet ie9 altındaki ie tarayıcıları için desteğe gerek yok ancak ie dışındaki tarayıcıları unutmamak lazım.. chrome, firefox, safari, opera v.s. hatta bunun ucu dolaylı olarak mobil v.s. media query lere kadar gider..

dolayısıyla bu konuyu sadece ie eski versiyonlarını kapatmak yerine iyice araştırmalı ve tüm püf noktalarını öğrenmeli..bir arayüzcünün bunları kullanmasına gerek kalmayacak şekilde csse dökebilse bile bilmesi şarttır..

çözünürlüğe ve mobile göre css için google: media query,

farklı tarayıcılarda css okutabilmek için google: css hack aramalarını yapabilir ve gelen kaynakları inceleyebilirsiniz. biz neler çektik ie6 ile uğraşırken.. :)

bugün eğer bir banka, kamu v.s. gibi bir kuruluşa web projesi yaparken hala karşınıza ie6, ie7 fixlemeleri gelebilir..böyle kapatıp geçemezsiniz..

çünkü böyle kuruluşların bünyesinde binlerce bilgisayar ve bunun için de oluşturdukları IT politikaları vardır..işletim sistemleri satın alımları toplu olarak ve enterprise anlaşmalarla yapılır. Xp varken hala win98 kullananlar olduğu gibi, şu anda da ancak xp'ye terfi edip orada kalmış olan pek çok kuruluş var. Windows update otomatik kapalı olduğu için tarayıcı güncellemesi yok ve ie8 hatta ie6 kalan bile vardır.. ve bir proje yaparken oturup şu zamanda bile ie6 için css hack yapmak gerekebilir..

uzun lafın kısası; css hack öğrenilmesi gereken bir şey ;)

bulmak zor olacaktı :) kod için teşekkürler
sana önereceği tek kod şudur :)

Alıntı:

Alıntı:

Alıntı:


verdiginiz butun cevaplar icin tesekkürler. önerilerinizi dikkate alacam en kısa sürede geri dönüs yapıcam. simdiden kolay gelsin herkese

Bak burada hangi CSS kodunun hangi tarayıcı tarafından desteklendiği yazıyor.
http://www.w3schools.com/cssref/css3_browsersupport.asp
Buna göre bakıp tümünde desteklenen ortak bir kod yazabilirsin. Ya da eski sürümler için ayrı CSS çağırırsın değiştirip.

Uğraştırır diyorsan bunun için ufak bir javascript var indirip deneyebilirsin:
http://rafael.adm.br/css_browser_selector/