Bootstrap 中的 CSS 表答案

【问题标题】：CSS Tables in BootstrapBootstrap 中的 CSS 表
【发布时间】：2023-04-06 16:11:01
【问题描述】：

早上好！

我目前正在使用引导程序设计一个网站。我使用 table-responsive 来创建一个表。我自定义了表格，但我无法删除灰色下划线？

<div class="table-responsive">
  <table class="table">
   <thead>
    <tr>
      <th>Track Name</th>
      <th>Requested</th>
      <th>Status</th>
    </tr>
   </thead>
   <tbody>
    <tr>
      <td><p>Remotion (Original Mix)</p><p><small><span class="grey_color">by</span> Ovaal</small></p></td>
      <td>1 day ago</td>
      <td><span class="label label-primary"><small>Waiting for Approval</small></span></td>
    </tr>
    <tr>
      <td><p>Remotion (Original Mix)</p><p><small><span class="grey_color">by</span> Ovaal</small></p></td>
      <td>1 day ago</td>
      <td><span class="label label-primary"><small>Waiting for Approval</small></span></td>
    </tr>
  </tbody>
  </table>
</div>

我尝试将 margin-top 添加到 tbody 以及将 margin-bottom 添加到 thead。没有任何效果。

非常感谢！

【问题讨论】：

你会制作小提琴吗？
下划线？？哪个下划线？你是在说边界吗？

标签： html css twitter-bootstrap

【解决方案1】：

您必须覆盖 boostrap.css 中的相关规则 - 例如

.table thead > tr > th, 
.table tbody > tr > th, 
.table tfoot > tr > th, 
.table thead > tr > td, 
.table tbody > tr > td, 
.table tfoot > tr > td {
    border: none; 
}

示例：http://jsfiddle.net/52VtD/403/

【讨论】：

非常感谢。完美:)

【解决方案2】：

试试

table tr{border: none;}

干杯

【讨论】：

这还不够具体，无法覆盖 Bootstrap。