Question

我想了解设置表格大小的最佳做法是什么 - 宽度 - 以便单元格中的内容不会离开表格（特别是水平）但是它们将被强制留在单元格中。

我需要在<table>元素级别设置宽度，高度，还是应该为<tr>和<td>元素设置？

例如，此表：

<table>
        <tr >
            <td>
                Name
            </td>
            <td>
                Mr.Tuber
            </td>
        </tr>

        <tr >
            <td>
                Surname
            </td>
            <td>
                Tupova
            </td>
        </tr>
</table>

Answer 1

只要您在单元格中放置文本，单元格的内容就不会出现在表格之外。

构建这样的表的一个好方法是使用CSS设置表的整体大小以及列的宽度。让表格垂直展开以自动容纳内容。

<table class="table1">
        <tr>
            <td class="col1">
                Name
            </td>
            <td class="col2">
                Mr.Tuber
            </td>
        </tr>

        <tr>
            <td>
                Surname
            </td>
            <td>
                Tupova
            </td>
        </tr>
</table>

CSS：

table.table1 {
     width:500px
}

table1 .col1 {
     width:200px
}

您不需要专门设置col2，因为如果遗留下来它将占用任何空间。您可能还希望使用TH代替TD作为标题单元格，这样您可以设置与内容单元格不同的样式。

.table1 th { ... }

设置？<table> </table>的大小的最佳做法是什么？

1 个答案: