Versuchen, Bootstrap-Tabelle-gestreifte Farbe in LESS zu überschreiben, nicht zutreffen?

Question

Ich versuche eine gemeinsame CSS-Klasse in meiner LESS-Datei zu erstellen, die von der Bootstrap-Tabelle erbt. Wenn ich den Standard nehme, funktioniert es gut, aber ich möchte die Farbe der gestreiften Zeilen ändern. Bei einigen Recherchen habe ich Code gefunden, der funktionieren sollte, aber nicht zutrifft. Tatsächlich überschreibt es das Standard Bootstrap .table-striped und zeigt nicht einmal die normale weiße Hintergrundfarbe.

.vtc-table{ 
    .table; 
    .table-condensed; 
    .table-bordered; 
    .table-hover; 
    .table-striped > tbody > tr:nth-child(odd) > td { 
     background-color: antiquewhite; 
    } 
    th { 
     background-color: #2FA4E7; 
     color: white; 
    } 
} 

Ich rufe nur die allgemeine Klasse auf der Tabellenebene.

<table class="vtc-table"> 

UPDATE

Großen Dank der Hilfe dieser @makshh ist letztlich das, was wir damit gearbeitet kam. Dies fügt einen Rahmen um die gesamte Tabelle sowie Zeilen/Zellen hinzu, setzt die Hauptfarbe der Zeilen auf Weiß und färbt dann die "ungeraden" Zeilen mit Antikweiß. Hoffentlich hilft das auch anderen.

.vtc-table { 
    border: 1px solid #ddd; 
} 
.vtc-table > thead > tr > th, 
.vtc-table > tbody > tr > th, 
.vtc-table > tfoot > tr > th, 
.vtc-table > thead > tr > td, 
.vtc-table > tbody > tr > td, 
.vtc-table > tfoot > tr > td { 
    border: 1px solid #ddd; 
} 
.vtc-table > thead > tr > th, 
.vtc-table > thead > tr > td { 
    border-bottom-width: 2px; 
} 
.vtc-table > tbody > tr { 
    background-color: white; 
} 
.vtc-table > tbody > tr:nth-of-type(odd) { 
    background-color: #fcf8e3; 
} 
.vtc-table > thead > tr > th, 
.vtc-table > tbody > tr > th, 
.vtc-table > tfoot > tr > th { 
    background-color: #2FA4E7; 
    color: white; 
} 

Und es heißt so in der HTML.

<table class="table vtc-table"> 

Answer 1

1. table-striped Klasse hat den table div hinzugefügt werden (Sie haben & zu verwenden).
2. Der richtige Selektor für den gestreiften Tisch ist .table-striped > tbody > tr:nth-of-type(odd).
3. Wenn Sie th ändern möchten, müssen Sie verschiedene Selektoren verwenden (um eine geringe Spezifität zu vermeiden).

.vtc-table { 
    .table; 
    .table-condensed; 
    .table-bordered; 
    .table-hover; 
    &.table-striped > tbody > tr:nth-of-type(odd) { 
    background-color: antiquewhite; 
    } 
    > thead > tr > th, 
    > tbody > tr > th, 
    > tfoot > tr > th { 
    background-color: #2FA4E7; 
    color: white; 
    } 
}