Question

您好我试图从我的桌子上删除边框。

这是我的代码：

<table class="table table-responsive" style="border:none"> 
     <tr>
        <th>First name</th>
        <th>Last name </th>
     </tr> 
     <tr>
        <td>Tima</td>
        <td>Zahra</td>
     </tr> 
     <tr>
        <td>Emily</td>
        <td>SMITH</td>
     </tr> 
</table>

但它没有用。请帮我！我很抱歉我的英语不好，我希望你能理解它。

Answer 1

只需使用以下css：

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

Answer 2

只需在头部

中进行以下更改即可

<style>
  .borderless tr, .borderless td, .borderless th {
    border: none !important;
   }
</style>

并且身体部分发生了这种变化：

<table class="table table-responsive borderless"> 
             <tr> <th>First name</th><th>Last name </th></tr> 
             <tr> <td>Tima</td> <td>Zahra</td> </tr> 
             <tr><td>Emily</td> <td>SMITH</td> </tr> 
</table>

这对你有帮助。谢谢:)）

Answer 3

使用table-borderless 引导类。请注意我下面的表格有斑马条纹，但那是因为我想要它们并且对表格边框没有影响。如果您也不想要条纹，只需删除 table-striped。

<table class="table table-striped table-borderless">
<thead>
<tr>
<th scope="col">Pos</th>
<th scope="col">Name</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Adam</td>
</tr>
</tbody>
</table>

如何从引导表中删除边框响应？

3 个答案: