Bootstrap 4 beta ( 最新版 ) 改变条纹表的颜色答案

【问题标题】：Bootstrap 4 beta ( latest version ) Change colors of striped tableBootstrap 4 beta ( 最新版 ) 改变条纹表的颜色
【发布时间】：2017-09-15 20:50:44
【问题描述】：

我有一个条带表，编码如下：

<table class="table-sm table-hover table-striped">
            <thead>
                <tr>
                    <th>#</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Email</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th scope="row">1</th>
                   ...
            </tbody>
        </table>

我使用的是最新的 Bootstrap 4 测试版。我想更改 Bootstrap 用来“条纹”行的交替颜色。我无法在文档中找到任何内容。根据 Stack Overflow 上一篇四年前的帖子，我可以添加自己的 css 文件。但是，如果可能的话，我想只使用引导类来做到这一点。

感谢您的帮助，马克

【问题讨论】：

标签： css twitter-bootstrap bootstrap-4

【解决方案1】：

如果您检查演示页面 Bootstrap v4 tables 上的元素，您会发现它们的目标是 Bootstrap .table-striped 类。具体来说，奇数行。这是一个可以帮助JSfiddle的演示。

.table-striped tbody tr:nth-of-type(odd) {
    background-color: red;
}

【讨论】：

【解决方案2】：

您忘记将table 类添加到您的元素中，这样<table class="table table-sm table-hover table-striped"> 应该可以工作，或者您可能没有正确包含bootstrap CSS

【讨论】：