table 使用 bootstrap 将标题置于底部

Question

Table 标题位于 table 的顶部，但是当我使用 bootstrap class 时，它会转到 table 的底部。

<table class="table table-bordered">
    <caption>why?</caption>
    <tr>
        <th>1</th>
        <th>2</th>
        <th>3</th>
    </tr>
    <tr>
        <th>4</th>
        <td>5</td>
        <td>6</td>
    </tr>
</table>

如何将它对齐到 table 的顶部？

Answer 1

那是因为 bootstrap 4 具有默认标题 css 样式 - caption-side: bottom

当您更改 caption-side: top; 时，您的标题将位于 table 的顶部。

table 使用 bootstrap 将标题置于底部

table caption goes bottom using bootstrap

html

twitter-bootstrap-4