9

我无法让我的 table-stripe 类与我的 Bootstrap 框架一起使用。

这是我的桌子的实时预览。我在我的 HTML 中设置了 .table-striped 类，但它没有显示在输出中。

我究竟做错了什么？

4

3 回答 3

36

你的html是错误的。每行都有一个tbody标签，但 css for.table-striped依赖于tr:nth-child()以不同的方式设置行的样式：

.table-striped tbody > tr:nth-child(odd) > td,
.table-striped tbody > tr:nth-child(odd) > th

修复您的 html，以便您有一个 tbody 进行迭代。

另外，我在您的资源中看到了 bootstrap.css 和 bootstrap.min.css。一个就够了。

于 2013-05-26T13:46:59.330 回答
3

问题在于您的表格标记。根据引导文档，您将每一行包装在一个 tbody 标记中：

通过 :nth-child CSS 选择器将斑马条纹添加到任何表格行（在 IE7-8 中不可用）。

因此，如果您检查并删除所有 tbody 标记，以便在表格主体的开头只有一个，在结尾处只有一个，它应该可以按预期工作。

于 2013-05-26T13:46:49.190 回答
0

只是一个附加信息，ng-repeat 应该是：

<tr> inside <tbody>:

<table class="table table-striped">
    <thead>
        <tr>
            <th class="col-md-1"></th>
            <th class="col-md-5"></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="v1 in v">
            <td><span class="glyphicon glyphicon-trash"/></td>
            <td>{{v1.name}}</td>
        </tr>
    </tbody>
</table>
于 2017-02-24T13:32:06.353 回答