twitter-bootstrap 如何提高引导斑马条纹表的对比度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16306122/
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
How can I improve contrast on bootstrap zebra striped table
提问by user61629
I have the following twitter bootstrap table with zebra striping:
我有以下带有斑马条纹的 twitter 引导表：
<table class="table table-striped">
<thead>
<tr>
<th>Advantage</th>
<th>Details</th>
</tr>
</thead>
<tbody>
<tr>
<td>aaaaa</td>
<td> bbbbb </td>
</tr>
<tr>
<td> ccccc</td><td> ddddd</td>
</tr>
</tbody>
</table>
The problem is I can't see the zebra striping! It all looks monotone to me. How can I improve the contrast of the zebra striping?
问题是我看不到斑马条纹！在我看来，这一切都是单调的。如何提高斑马条纹的对比度？
Thanks in advance,
提前致谢，
Bill
账单
回答by Rick Viscomi
The corresponding CSS is:
对应的CSS是：
.table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th {
background-color: #f9f9f9;
}
Add a new rule to your stylesheet that overrides this background color to something clearer for you.
向您的样式表添加一个新规则，该规则将这个背景颜色覆盖为更清晰的内容。
回答by Jason Sperske
If you are building Bootstrap from it's .lessfiles look at variables.css, specifically this line (from github):
如果您正在从它的.less文件中构建 Bootstrap，请查看variables.css，特别是这一行（来自github）：
@tableBackgroundAccent: #f9f9f9; // for striping
You an also use the customizer.
您还可以使用定制器。
As for a darker gray, this hex value could work: #DBDBDB(it's a slightly darker gray with the same balanced mix of red green and blue)
至于更深的灰色，这个十六进制值可以工作：（#DBDBDB它是一个稍深的灰色，具有相同的红绿色和蓝色平衡混合）
