2011-05-29 10 views
5

CSS'de çok fazla tecrübem yok, ancak kısa bir süre önce, bir sınıf seçiciden önce bir boşluk olmadan önce bir boşluk bulunma arasında bir fark olduğunu öğrendim. Şimdiye kadar, onların sadece iki farklı şey olarak yorumlandığını biliyorum ... CSS'de deneyimlenen biri bana özel farkın ne olduğunu açıklıyor mu? Bu aynı zamanda kimlik seçici için de geçerli midir?"#someid ul li.someclass a" ve "#someid ul li .someclass a" arasındaki fark nedir? (boşlukları gör)

Teşekkürler. cevaplarını takdir et.

cevap

9

#someid ul li.someclass a sınıf someclass varsa ve kendilerini kimliği someid ile
eleman torunları
sırasız listelerin torunları
liste öğelerinin torunları

Tutturucuları anlamına gelir.

#someid ul li .someclass a sınıf someclass sahip
herhangi elementlerin torunları ve kendileri torunları
sırasız listelerin torunları
liste öğelerinin torunları

Tutturucuları demektir
numaralı ID numarası someid.

Yani, şu işaretlemesinde <a> eleman birinci kuralla, ancak ikinci ile uyar:

<div id="someid"> 
    <ul> 
     <li class="someclass"> 
      <a href="foo.html" /> 
     </li> 
    </ul> 
</div> 

Ve aşağıdaki işaretlemesinde <a> eleman ikinci kuralla eşleştirilir, ancak ilk ölçütü:

<div id="someid"> 
    <ul> 
     <li> 
      <span class="someclass"> 
       <a href="foo.html" /> 
      </span> 
     </li> 
    </ul> 
</div> 
+1

+ 1 Umarım, düzenlemem işleri daha net hale getirir. Paragrafları okumak çok zordu;) – BoltClock

+0

@BoltClock, bu gerçekten çok daha açık bir fikirdir (Sanırım hep birlikte cümleleri bir arada tutmayı amaçlamamalıyım, sonuçta, bu * kod * burada çoğu zaman bahsediyoruz)). Güzel düzenleme, teşekkürler :) –

+0

@everyone: +1 açıklama için teşekkürler –

4

İki örnekler:

#someid ul li.someclass a

<div id="someid"> 
    <ul> 
    <li> 
     <div class="someclass"> 
     <a href="http://www.example.com">link</a> 
     </div> 
    </li> 
    </ul> 
</div> 

Ayrıca, bu ikisini de vuracak fark bu örnekte çapa etiketi vuracak bu örnekte

<div id="someid"> 
    <ul> 
    <li class="someclass"> 
     <a href="http://www.example.com">link</a> 
    </li> 
    </ul> 
</div> 

#someid ul li .someclass a yılında çapa etiketi vuracak:

<div id="someid"> 
    <ul> 
    <li class="someclass"> 
     <div class="someclass"> 
     <a href="http://www.example.com">link</a> 
     </div> 
    </li> 
    </ul> 
</div> 
İlgili konular