覆盖 bootstrap table-striped CSS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25043759/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Overriding bootstrap table-striped CSS
提问by Jordan.J.D
I am trying to change the background-color of rows that contain my foundclass in a striped bootstrap table. It works for even rows because bootstrap doesn't have a background color for them, but odd rows I am blocked by bootstraps CSS.
我正在尝试更改found条带引导表中包含我的类的行的背景颜色。它适用于偶数行，因为引导程序没有它们的背景颜色，但我被引导程序 CSS 阻止了奇数行。
Bootstrap CSS:
引导 CSS：
.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
background-color: #f9f9f9;
}
Custom CSS:
自定义 CSS：
tr.found{
background-color:#CECBCB;
}
How would I override bootstrap's CSS for only a single row at a time (as you can see in demo, odd rows are not overridden)?
我将如何一次仅覆盖一行的引导程序 CSS（如您在演示中所见，奇数行未被覆盖）？
回答by Mr. Alien
Write specific selector to override the bootstrap ones
编写特定的选择器来覆盖引导程序
table.table.table-striped tr.found td {
background-color:#CECBCB;
}
Also, not only specificity matters here, make sure you apply the background to the tdelement and not the trbecause bootstrap is applying to the tdelement so even if you apply the background to trwon't make sense.
此外，这里不仅特殊性很重要，还要确保将背景应用于td元素，而不是tr因为引导程序应用于td元素，因此即使将背景应用于元素tr也没有意义。
As you said that you wanted the explanation for the selector I wrote, so here it goes, let us break that and understand..
正如你所说，你想要我写的选择器的解释，所以在这里，让我们打破它并理解..
Starting off with this
从这个开始
table.table.table-striped- Over here am selecting a tableelement having classes .tableAS WELL AS .table-striped
table.table.table-striped-在这里我选择一个table具有类元素.table以及.table-striped
Going further with the selector, tr.foundwe select the trelements having a classcalled .foundand lastly, we select the nested tdelements.
进一步使用选择器，tr.found我们选择tr具有class被调用的元素.found，最后，我们选择嵌套的td元素。
回答by pmilla1606
.table-striped>tbody>tr:nth-child(odd)>td,
tr.found{
background-color:#CECBCB;
}
回答by Branstar
In addition to Mr. Alien's solution, I found that the following works in Bootstrap 4 without explicitly overriding the table style.
除了 Alien 先生的解决方案之外，我发现以下内容在 Bootstrap 4 中有效，而无需明确覆盖表格样式。
tr.found td{
background-color:#CECBCB;
}
