html - 对分隔的连续表格应用相同的表格列宽

标签 html css twitter-bootstrap twitter-bootstrap-3 html-table

我试图让两个表看起来彼此相似，并且列的大小相同。到目前为止，我已经尝试为它们提供一个固定的大小，该大小在 Bootstrap 媒体查询时会发生变化，但这并不是很好。

我也曾尝试使用 cols，但出于某种原因，它们没有提供相同的列大小。

这是一张显示我希望它们看起来如何的图片:

HTML 标记:

<div class="container-fluid services animated fadeIn">
<table class="table services">
    <thead>
        <tr>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>
</div>

这是 JSFiddle 上的完整代码和示例

最佳答案

也为第二个表添加空的 th 和 td，并使用 table-layout:fixed 表的 css 属性，我们可以实现所需的输出。

检查fiddle

关于html - 对分隔的连续表格应用相同的表格列宽，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35586438/