CSS3: nth-child () selektora
selektorów CSS Kompletna instrukcja referencyjna
Przykłady
Określić każdy element p pasuje do koloru tła elementu nadrzędnego drugiego podelementu:
p:nth-child(2)
{
background:#ff0000;
}
{
background:#ff0000;
}
Spróbuj »
Definicja i Wykorzystanie
: Nth-child (n) selektor dopasowanie elementu nadrzędnego n-tego elementu.
nmoże być liczbą, słowo kluczowe lub formułą.
Wskazówka: Patrz selektora .Selektor pasuje ten sam typ n-tym rodzeństwem rodzeństwa.
Pomoc Browser
Wartości podane w tabeli przedstawiają pierwszą przeglądarką obsługującą numer wersji obiektu.
选择器 | |||||
---|---|---|---|---|---|
:nth-child() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
Więcej przykładów
Przykład 1
<P dziwne, a nawet mogą być używane jako słowo kluczowe, aby dopasować podelementu jest używany, jego indeks jest parzysty, czy nieparzysty (indeks pierwszego dziecka wynosi 1). Tutaj możemy określić dwa różne kolory tła dla parzystych i nieparzystych p elementów:
p:nth-child(odd)
{
background:#ff0000;
}
p:nth-child(even)
{
background:#0000ff;
}
{
background:#ff0000;
}
p:nth-child(even)
{
background:#0000ff;
}
Spróbuj »
Przykład 2
Stosując wzór (an + b) Opis: rozmiar przedstawiciel cyklu, N jest licznik (zaczynając od 0) i B jest offset. Tu wszystkie indeksy są wielokrotnością trzech elementu p Określa kolor tła:
p:nth-child(3n+0)
{
background:#ff0000;
}
{
background:#ff0000;
}
Spróbuj »