Farklı tarayıcılar için oluşturulan farklı web dosyaları

7 Cevap php

Sadece son on yıl için, HTML / CSS tüm kitapları her zaman tarayıcı incompatiblities ve nasıl CSS, JS, HTML ya da daha fazla "kesmek" ekleyerek bu sorunu aşmanın hakkında konuşmak bana oluşur. Neden başka bir yol ile uğraşmak (ve ben en iyi yolu inanıyorum) tarayıcı kullanılan bir html dosyasının ilk satırında, kendısı de (ne olursa olsun php, c) daha sonra eklemek kodu eklemek için tavsiye asla olmasıdır Bu tarayıcı için CSS / JS dosyaları uygun olanı?

7 Cevap

Geçmişte size müşteri buna dayalı kullanarak ve çalıştırma kodu hangi tarayıcı belirlemek için JavaScript kesmek eklersiniz. Bunu yapmak için bir karar en iyi yolu yoktu gibi yani her kitap kendi uygulama bulunuyor vardı görünüyor.

Tarayıcıyı belirlemek ve daha sonra kod boyunca gibi şeyler görmek istiyorum eski kitaplar kodu bir sürü bulacaksınız:

if (NS4) {

} elseif (IE) {

}

Ama büyük ölçüde bu artık modası geçmiş bulunuyor.

Biz şimdi başka büyük bir şey var hala birkaç mevcut uyumsuzluklar soyut bazı bakmak JQuery gibi çerçeveler vardır. Büyük toplum tarafından kabul birleşik bir tek orada değildi bu yüzden geçmişte bana görünüyor, insanlar sadece JQuery-ulu çerçeveler, kendi tarzını rulo.

Kullanıcı aracısı dizeleri hakkında benim en sevdiğim tırnak biri Chrome ile geldi yayınlandı:

"And thus Chrome used WebKit, and pretended to be Safari, and WebKit pretended to be KHTML, and KHTML pretended to be Gecko, and all browsers pretended to be Mozilla, and Chrome called itself Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13, and the user agent string was a complete mess, and near useless, and everyone pretended to be everyone else, and confusion abounded."

Bu salt bir iyi komedi - http://webaim.org/blog/user-agent-string-history/

Çünkü Sunucu / İstemci bölünmenin olduğunu. Bu sunucu üzerinde çalışan koddan bir müşteri ayarlarını tespit etmek mümkün değildir.

Eğer bunu seçerseniz alternatif CSS veya JavaScript dosyaları yüklemek sağlayacak HTML Koşullu görmediniz vardır.

A Quickie reference on Conditional Comments

O zaman iki css setleri ve js dosyalarını korumak zorunda çünkü. Eğer iki dosya değişiklikleri bir değişiklik yapmak her zaman yapmak zorunda dışında olduğunu, gerçekten biri "kesmek" ekleyerek daha farklı değil.

Eğer sadece tarayıcı algılama kullanırsanız, yeni bir tarayıcı veya tarayıcı sürümü yayınlandı her zaman listenizi güncellemeniz gerekir. Bu söylenmeden yeni sürümü kullanıcılar gibi gülünç durumlar upgrade eski bir sürüme geri neden olur.

Tarayıcı tutarsızlıklar yetenekleri için test tarafından ele alınmalıdır. Diğerleri de söylediğim gibi, sizin için ele JQuery benzeri JavaScript çerçeveler vardır. CSS ile ilgili olarak, diğerleri de söylediğim gibi Internet Explorer'ın eski sürümlerini hedef koşullu yorum kullanın. Onlar etrafında çalışmak için çalışıyorlardı sorunu gidermekle olmadan yeni bir sürümü sabit olabilir, çünkü "hack" kullanarak önlemek için deneyin.

Matthew Vines koşullu yorumlar bu biraz benziyorsun ne dedi ilerletmek için ...

<!--[if lte IE 6]><link href="LayoutIE6.css" type="text/css" rel="stylesheet" /><![endif]-->
<!--[if gte IE 7]><link href="LayoutIE7.css" type="text/css" rel="stylesheet" /><![endif]-->
<!--[if !IE]><link href="Layout.css" type="text/css" rel="stylesheet" /><![endif]-->

Bu yardımcı olur umarım :)

Bu çünkü (çoğunlukla ve için 'geleneksel' bile) CSS hackery / her zaman komut dosyası arka uç erişiminiz yoksa ön-uç geliştiriciler tarafından uygulanır oldu. Web-geliştirme ilk günlerinde arka-uç geliştiriciler tarafından tahrik edilmiş olsaydı ben sık sık şeyler çok farklı olacağını düşündüm.

Ben bu arada hiç bir kötü bir soru (başlangıçta nedense aşağı seçildi) olduğunu sanmıyorum. CSS & için ve kayıt için, koşullu yorumlar jQuery gibi istikrarlı bir JS çerçeve kesinlikle gitmek için yoludur.

Ben daha iyi bir çözüm olduğunu düşünüyveyaum:

Basit bir çözüm, sadece bu kütüphane JS kullanmak ve kolayca her tarayıcı / os kombinasyonu için stilleri uygulayabilirsiniz:

BrowserClass.js

Bu ile kullanılan işletim sistemi ile de tarayıcınızın güncel adı ve sürümü ile gövde etiketi üzerinde bir sınıf adını alacak.

Sonra dosyayı içerir:

<script src="js/browserclass.js"></script>

Son krom, Windows 8.1 Örneğin göreceksiniz:

<body class="chrome chrome34 win desktop">

And in your style file you can refer by: (.sass styling)

body.chrome
  #example
    colveya: blue

veya

body.win.chrome
  #example
    colveya: red

Not:

[if IE] statements deprecated since IE10 so this is the solution fveya that