我可以把两列放在Bootstrap面板里吗？

Question

刚开始使用Bootstrap。

是否有一种在面板中放置两列的方法？

谢谢

- user3319446

---

我猜使用表格会是一种更经济的选择。 - Ranveer

你尝试过什么吗？ - ravibagul91

Answer 1

当然，就像创建任何Bootstrap列一样：

<div class="panel panel-default">
     <div class="panel-heading">Title</div>
     <div class="panel-body">
        <div class="row">
            <div class="col-md-6">col1</div><div class="col-md-6">col2</div>
        </div> 
        <div class="row">
            <div class="col-md-6">col1</div><div class="col-md-6">col2</div>
        </div> 
        <div class="row">
            <div class="col-md-6">col1</div><div class="col-md-6">col2</div>
        </div> 
     </div>
</div>

http://www.bootply.com/114526

- Zim

Answer 2

你也可以有一个包含表格的面板：

<div class="panel panel-default">
     <div class="panel-heading">Title</div>
     <table class="table">
        <tr>
            <td>Column 1</td>
            <td>Column 2</td>
        </tr>
     </table>
</div>

- Brent Washburne

---

绕过Bootstrap的效率...各种Bootstrap组件采用具有“display：table”的样式，这些样式几乎具有与HTML表格相同的功能，但更加灵活。 - Gabe Hiemstra

“Panel - With tables”是Bootstrap的标准功能。你为什么认为它“绕过了Bootstrap的效率”？ - Brent Washburne

也许我错了，但我认为@Gabe的意思是我们在任何情况下都不应该使用表格，这是错误的。当然，我们不应该将表格用于布局，但我的网络应用程序中有许多部分处理原始数据，需要以表格形式显示。以下是使用 Bootstrap 将表格添加到面板的方法。 - Bobort

我赞同这个观点。使用表格进行布局=非常糟糕，但如果您的布局是表格形式的，那么使用它们就完全可以接受。 - Cranio

对内容进行语义测试。你的数据是否具有语义表格形式（例如，你所展示的数据是否是在上下文中以表格形式展现的）？还是只是想要一个网格（通常是低维网格，如几行），用于视觉对齐目的？如果是后者，请使用Bootstrap网格。 - cowbert