SORU
28 Mayıs 2012, PAZARTESİ


CSS ~ (tilde/değilsin/twiddle seçici) ne iş yapar?

~ tek bir karakter için arama kolay değil. Bazı css bakıyordum ve bunu buldum

.check:checked ~ .content {
}

Bu ne anlama geliyor?

CEVAP
28 Mayıs 2012, PAZARTESİ


~ seçici aslında General sibling combinator:

Genel kardeş kombinatorik ile yapılır. "" (U 007E, ~)tilde karakter o kadar basit seçiciler iki dizileri ayırır. Bu elemanları iki dizileri ile temsil edilen aynı üst payı belge ağacı ve eleman ilk sırasını temsil önündeki (mutlaka hemen) öğesi tarafından temsil ikincisi.

Düşünün aşağıdaki örnek:

.a ~ .b {
  background-color: powderblue;
}
<ul>
  <li class="b">1st</li>
  <li class="a">2nd</li>
  <li>3rd</li>
  <li class="b">4th</li>
  <li class="b">5th</li>
</ul>

.a ~ .b madde çünkü: 4 ve 5. liste ile eşleşir

  • .b elementler
  • .a kardeş
  • HTML kaynak sırası .a sonra görünür.

Aynı şekilde, .check:checked ~ .content .checked:checked kardeşler .content tüm öğeleri eşleşen ve sonra görünür.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Abbeydabby0277's channel

    Abbeydabby02

    9 ŞUBAT 2012
  • Day9TV

    Day9TV

    22 NİSAN 2010
  • efaustus9

    efaustus9

    16 HAZİRAN 2006