2012-12-17 14 views
5

Herkes açıklayabiliyor (github sayfası olmadığından) Neden Modernizr bu sınıf adlarının tümünü HTML etiketine ekleme gereği duyuyor? Modernizr yükledikten sonra, şuna benzer: Modernizr kütüphanesini kullanarak, neden html etiketine sınıflar ekliyor

<!doctype html> 
<html class=" js flexbox canvas canvastext webgl ~~~~ etc etc 

Ben hiç o yapmak istediği niçin hiçbir açıklama bakın. Modernizr, örneğin tuvalin desteklenip desteklenmediğini bildirmek için özellikler sağlar (Modernizr.canvas == true?). Bu html classnames, bundan daha kolay bir test için eklenmiş mi?

cevap

8

Bu sınıf adları CSS kodunuzda kullanılmak üzere tasarlanmıştır, böylece bir özelliğin desteklenmemesi durumunda yedek stilleri ekleyebilirsiniz. Modernizr dokümanlar sayfası örneği:

/* Simulated box shadow using borders: */ 
.box { 
    border-bottom: 1px solid #666; 
    border-right: 1px solid #777; 
} 
.boxshadow div.box { 
    border: none; 
    -webkit-box-shadow: #666 1px 1px 1px; 
     -moz-box-shadow: #666 1px 1px 1px; 
      box-shadow: #666 1px 1px 1px; 
} 
+0

CSS'yi öğrenmem gerekecek gibi görünüyor. Stil özellikleri hakkında her zaman yeterince bilgi sahibi olduğumu düşünmüştüm ama bu bazı ileri düzey şeyler gibi görünüyor. – Dee2000

+0

Birinin bu cevabı onayladığı görüyorum. Sanırım bunun cevabı bu. Ben cevabını işaretlemek için işarete tıkladım bile nasıl/neden cevap olduğunu anlamıyorum :) – Dee2000

+0

@ Dee2000, mantıklı olduğu için onu oy kullandım. Bu örnekte, tarayıcınızın açılır gölgeleri desteklemediğini söyleyin; .boxshadow div.box "asla" hedeflenmiş olmamalıdır, bu nedenle, .box bir yedek olarak kullanılır – series0ne

1

Hatalı olabilirim (ve eğer varsa lütfen beni düzeltin), buradaki sınıflar, Modernizr'in tarayıcıda desteklenen (veya gerçekten de değil) algıladığı özellikleri gösterir. http://modernizr.com/docs/

bu örneği ele alalım:: Burada docs at

Bak

<html class="no-js"> 

JavaScript devre dışı bırakılırsa, o zaman modernizr koşamam ve bu nedenle sınıf "no-js" kalacak ancak JavaScript etkinse , Modernizr, "js" ile "no-js"'u değiştirecek ve benzer şekilde başka hangi özelliklerin desteklendiğini size söyleyecektir

+0

"no-js" ifadesini görmezden geleceğim çünkü bu garip bir örnek. Ama elde edemediğim şey, bir yöntem zaten mevcut olduğunda, bu sınıfları html etiketine eklemenin bir nedeninin var olmasıdır. Örneğin, videonun desteklenip desteklenmediğini algıladığında, (a) modernizr.video'ın test etmek için JS'nizde kullanabileceğiniz ve (b) "video" sınıfının html etiketine eklendiğini garanti eder (bilinmeyen bir sebepten dolayı). Belgeler nedenini açıklamıyor. – Dee2000

+0

@ Dee2000 - "Nasıl Çalışıyor" konusuna bakın: http://modernizr.com/ – series0ne

+0

@ Dee2000, sanırım fikrin, CSS’nizde html.flexbox’ın bulunması, ki bu da belgenizde geziniyor. . ama, eğer Modernizr, html etiketinize asla "flexbox" koymazsa, CSS'nizde asla hedeflenmez ... bu mantıklı değilse bana bildirin. – series0ne