在使用Bootstrap时，我遇到了一个CSS问题。同时我还在使用Angular JS和Angular UI.bootstrap（这可能是问题的一部分）。
我正在制作一个网站，在表格中显示数据。有时，数据包含我必须在表格中显示的对象。因此，我想在普通表格内放置无边框表格，同时保留无边框表格内的分隔线。
但是，即使我明确表示不要在表格上显示边框，它也会被强制显示：
HTML：
<table class='table borderless'>
CSS：
.borderless table {
border-top-style: none;
border-left-style: none;
border-right-style: none;
border-bottom-style: none;
}
所以，在这里，我想要的只是内部边框。
在使用Bootstrap 3.2.0时，我遇到了Brett Henderson的问题（边框总是存在），因此我对其进行了改进：
HTML
<table class="table table-borderless">
CSS
：层叠样式表。.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
border: none;
}
.table-，就像Bootstrap 3为其他与表格相关的类所做的那样（例如table-striped等）。因此名称将是table-borderless。 - arogachev.table-borderless,，我仍然在表格底部得到了一个边框。 - Christopher Kingtable-borderless。它是从哪里来的？ - Arup Rakshit边框样式设置在td元素上。
html：
<table class='table borderless'>
CSS：
.borderless td, .borderless th {
border: none;
}
更新：自Bootstrap 4.1版本以来，您可以使用.table-borderless来移除表格边框。
https://getbootstrap.com/docs/4.1/content/tables/#borderless-table
.borderless th，因为Bootstrap样式也适用于 <th>。 - BenMorel<table class='table table-borderless'>。 - tomb类似于其余内容，但更具体：
table.borderless td,table.borderless th{
border: none !important;
}
.table.borderless时加上important。 - undefined.table类添加到您的<table>标签中。根据Bootstrap文档上有关表格的描述：对于基本样式-轻盈的内边距和仅水平分隔线-将基础类.table添加到任何<table>中。这似乎非常冗余，但考虑到表格在其他插件（如日历和日期选择器）中的广泛使用，我们选择了隔离自定义表格样式。
自Bootstrap v4.1以来，您可以将 table-borderless 添加到您的表格中，有关详细信息请参见官方文档：
<table class='table table-borderless'>
使用npm或CDN链接安装Bootstrap
<table class="table table-borderless">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">First</th>
<th scope="col">Last</th>
<th scope="col">Handle</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">Larry the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
通过此链接获取参考信息。
.borderless tr td {
border: none !important;
padding: 0px !important;
}
<table class='table borderless'>
<tr class='borderless' ....>
我按照Davide Pastore的方法扩展了Bootstrap表格样式，但是这种方法会将样式应用于所有子表格，而且不适用于页脚。
更好的解决方案是模仿核心Bootstrap表格样式，但使用你自己的新类：
.table-borderless>thead>tr>th
.table-borderless>thead>tr>td
.table-borderless>tbody>tr>th
.table-borderless>tbody>tr>td
.table-borderless>tfoot>tr>th
.table-borderless>tfoot>tr>td {
border: none;
}
当您使用<table class='table table-borderless'>时，只有带有该类的特定表格将被边框包围，而不是树中的任何表格。
border-类。<td class="border-0"></td>
或者
<table class='table border-0'></table>
确保在您想要进行的最后一次更改后结束类输入。
试试这个：
<table class='borderless'>
.borderless {
border:none;
}