Wybierz wszystkie „tr” oprócz pierwszego

Jak mogę wybrać wszystkie trelementy oprócz pierwszego trw tabeli z CSS?

Próbowałem użyć tej metody, ale okazało się, że nie działa.

Dodając klasę do pierwszego trlub kolejnych trs. Nie ma żadnej metody wybierania wierszy, które chcesz za pomocą samego CSS.

Jeśli jednak nie obchodzi Cię Internet Explorer 6, 7 lub 8:

tr:not(:first-child) {
    color: red;
}

Dziwię się, że nikt nie wspominał o użyciu kombinatorów rodzeństwa, które są obsługiwane przez IE7 i nowsze wersje:

tr + tr /* CSS2, adjacent sibling */
tr ~ tr /* CSS3, general sibling */

Oba działają dokładnie tak samo (w każdym razie w kontekście tabel HTML) jak:

tr:not(:first-child)

idealne rozwiązanie, ale nie obsługiwane w IE

tr:not(:first-child) {css}

drugim rozwiązaniem byłoby nadanie stylu wszystkim trom, a następnie zastąpienie css dla pierwszego dziecka:

tr {css}
tr:first-child {override css above}

brzmi jak „pierwsza linia”, o której mówisz, to nagłówek tabeli - więc naprawdę powinieneś pomyśleć o użyciu theadi tbodyw swoim znaczniku ( kliknij tutaj ), co spowodowałoby „lepsze” znaczniki (semantycznie poprawne, przydatne do rzeczy takich jak czytniki ekranu ) i łatwiejsze, przyjazne dla różnych przeglądarek możliwości wyboru css ( table thead ... { ... })

Chociaż pytanie ma już przyzwoitą odpowiedź, chcę tylko podkreślić, że :first-childtag pasuje do typu elementu reprezentującego dzieci.

Na przykład w kodzie:

<div id"someDiv">
     <input id="someInput1" /> 
     <input id="someInput2" />
     <input id="someInput2" />
</div

Jeśli chcesz wpływać tylko na dwa pozostałe elementy z marginesem, ale nie na pierwszy, zrobiłbyś:

#someDiv > input {
     margin-top: 20px;
}
#someDiv > input:first-child{
     margin-top: 0px;
}

to znaczy, ponieważ inputs są dziećmi, umieściłbyś first-childw wejściowej części selektora.

Przykro mi, wiem, że to stare, ale dlaczego nie nadać stylu wszystkim elementom tr tak, jak chcesz, z wyjątkiem pierwszej i użyć klasy psuedo: first-child, w której odwołujesz to, co określiłeś dla wszystkich elementów tr.

Lepiej opisany w tym przykładzie:

http://jsfiddle.net/DWTr7/1/

tr {
    border-top: 1px solid;
}
tr:first-child {
    border-top: none;   
}

/ Patrik

Ponieważ tr:not(:first-child)nie jest obsługiwany przez IE 6, 7, 8. Możesz skorzystać z pomocy jQuery. Możesz go znaleźć tutaj

Inna opcja:

tr:nth-child(n + 2) {
    /* properties */
}

Może ktoś może skorzystać, poniżej jest to, czego użyłem

ol li:not(:first-child) {
    background: black;
    color: white;
}

Możesz również użyć selektora pseudo klas w swoim CSS w następujący sposób:

.desc:not(:first-child) {
    display: none;
}

To nie zastosuje klasy do pierwszego elementu z klasą .desc.

Oto JSFiddle z przykładem: http://jsfiddle.net/YYTFT/ , i jest to dobre źródło do wyjaśnienia selektorów pseudoklas: http://css-tricks.com/pseudo-class-selectors/

Możesz stworzyć klasę i korzystać z niej, gdy zdefiniujesz wszystkie swoje przyszłe wybory, które chcesz (lub nie chcesz) wybierać za pomocą CSS.

Dokonałoby się tego pisząc

<tr class="unselected">

a następnie w twoim css posiadającym linie (i przykładowo wykorzystując polecenie wyrównania tekstu):

unselected {
  text-align:center;
}



selected {
  text-align:right;
}