html - 使用 Bootstrap 面板删除 bootstrap 表格边框

Question

我最近接触了 bootstrap，我正在尝试制作一张 table ，但出于某种原因，如果我将我的 table 放在一个面板中，顶部、左侧、右侧、底部的边框突然消失，我我不确定是什么原因造成的。

<div class="container"> 
    <div class="row">
        <div class="col-sm-12">
            <div class="panel panel-default">
<br>
<table class='table table-striped table-bordered'>
<tr>
<td width='12%'>
<b>Message Title:</b>
</td>
<td>
Title
</td>
</tr>
<tr>
<td>
<b>Message Body:</b>
</td>
<td>
Body
<br /><br />
<h6><b>Created By:</b> John | <b>Created On:</b> February 13, 2015 3:45pm </h6>
</td>
</tr>
</table>
<hr>
<table class='table table-striped table-bordered'>
<tr>
<td width='12%'>
<b>Message Title:</b>
</td>
<td>
Title
</td>
</tr>
<tr>
<td>
<b>Message Body:</b>
</td>
<td>
Body
<br /><br />
<h6><b>Created By:</b> John | <b>Created On:</b> February 15, 2015 1:23pm </h6>
</td>
</tr>
</table>
<hr>
            </div>
        </div>
    </div>
</div>

我会放一张图片，但它说我需要 10 个声望点，但我希望你能解决我的问题。如果我移除面板，表格的边框会突然出现。

Answer 1

你可以使用那种风格。

<div class="panel panel-default">
   <div class="panel-heading">
      Panel heading without title
   </div>
   <div class="panel-body">
      Table content
   </div>
</div>