SORU
11 AĞUSTOS 2010, ÇARŞAMBA


CSS N. her öğesini seçin

Seçin, öğeleri kümesi, her dördüncü unsur söylemek mümkün mü?

Örn: 5 p elemanlar... gibi bir şey yazabilirim.

div:nth-child(4),
div:nth-child(8),
div:nth-child(12),
div:nth-child(16)

daha iyi bir yolu bunu yapmak için vardır?

CEVAP
11 AĞUSTOS 2010, ÇARŞAMBA


Adı, :nth-child() bir aritmetik ifade sabit sayıların yanı sıra n değişken kullanılarak inşa eder anlaşılacağı gibi. Gerçekleştirebilirsiniz ayrıca ( ), çıkarma (-) ve coefficient multiplication (an a bir tamsayı olmak üzere, pozitif sayılar, negatif sayılar ve sıfır).

Yukarıdaki seçici listesini yeniden yazmak istiyorsunuz:

div:nth-child(4n)

Bu aritmetik ifadeleri nasıl çalıştığı hakkında bir açıklama için, this question olarak spec cevabım bak.

Bu cevap aynı ana öğe içinde alt öğeleri div aynı öğe türü olduğunu varsayar unutmayın. Eğer başka unsurların farklı türleri gibi h1 p gerekir :nth-of-type() yerine :nth-child() sağlamak için tek sayısı div elemanları

<body>
  <h1></h1>
  <div>1</div>  <div>2</div>
  <div>3</div>  <div>4</div>
  <h2></h2>
  <div>5</div>  <div>6</div>
  <div>7</div>  <div>8</div>
  <h2></h2>
  <div>9</div>  <div>10</div>
  <div>11</div> <div>12</div>
  <h2></h2>
  <div>13</div> <div>14</div>
  <div>15</div> <div>16</div>
</body>

İçin her şey (sınıflar, özellikler, veya herhangi bir kombinasyon bu), nereye aradığın Kuzey çocuk eşleşen bir keyfi seçici, değil yapar bu bir saf CSS seçici. this question cevabım bak.


Bu arada, :nth-child() ile ilgili 4n ve 4n 4 arasında çok bir fark yok. Eğer n değişken kullanırsanız, 0 saymaya başlar. Bu her seçici maç:

:nth-child(4n)

4(0) = 0
4(1) = 4
4(2) = 8
4(3) = 12
4(4) = 16
...

:nth-child(4n 4)

4(0)   4 = 0    4 = 4
4(1)   4 = 4    4 = 8
4(2)   4 = 8    4 = 12
4(3)   4 = 12   4 = 16
4(4)   4 = 16   4 = 20
...

Gördüğünüz gibi, her iki seçiciler aynı unsurları olarak yukarıda maç olacak. Bu durumda, fark yok.

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

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • GirlSanctuaryBlog

    GirlSanctuar

    28 Aralık 2011
  • the one am radio

    the one am r

    6 Mayıs 2006
  • Tips On Linux

    Tips On Linu

    26 Temmuz 2008