Örnek
Her bir arka plan rengi belirtin <p> üst biriminin ikinci çocuğudur elemanı:
p:nth-child(2)
{
background: #ff0000;
}
Kendin dene " Daha "Try it Yourself" Aşağıdaki örnekler.
Tanımı ve Kullanımı
:nth- child( n ) seçicidir her elemanla eşleşir n üst biriminin, türü ne olursa olsun, çocuğun inci.
n bir sayı, bir anahtar ya da bir formül olabilir.
Tip: bak n'inci-of: type() olan eleman seçmek için selektör n çocuğa inci, of a particular type üst biriminin,.
Versiyon: | CSS3 |
---|
Tarayıcı Desteği
Tablodaki rakamlar tamamen seçici destekleyen ilk tarayıcı sürümü belirtir.
selektör | |||||
---|---|---|---|---|---|
:nth- child() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
CSS sözdizimi
Diğer Örnekler
Örnek
Kimin endeksi bile garip ve çocuk elemanları eşleştirmek için kullanılabilir Tek ve çift olan anahtar kelimeler (the index of the first child is 1) .
Burada, tek ve çift p elemanları için iki farklı arka plan renkleri belirtin:
p:nth-child(odd)
{
background: #ff0000;
}
p:nth-child(even)
{
background: #0000ff;
}
Kendin dene " Örnek
Bir formül kullanılarak ( an + b ) . Açıklama: a döngü boyutunu temsil eder, n bir sayaç olup (starts at 0) ve b bir ofset değeridir.
Burada, endeks 3 katı olduğu tüm p elemanları için bir arka plan rengini belirtmek:
p:nth-child(3n+0)
{
background: #ff0000;
}
Kendin dene "