html - 包装表中的列

Question

我有一个表格，其中一行有 10 个固定宽度的列，调整页面大小时调整表格的最佳方法是什么。

例如:如果我调整页面大小但只有 5 列适合，我如何将剩余的 5 列换行到新行？

我正在寻找执行此操作的最佳方法的指针。任何建议将不胜感激

谢谢

Answer 1

如果你想重排单元格，我猜你想要的不是真正的表格，只是对齐的元素。为此，最好使用 float ，就像这样...

<div style="overflow:auto">
    <div style="width:200px;float:left">A</div>
    <div style="width:200px;float:left">B</div>
    <div style="width:200px;float:left">C</div>
    <div style="width:200px;float:left">D</div>
    <div style="width:200px;float:left">E</div>
    <div style="width:200px;float:left">F</div>
    <div style="width:200px;float:left">G</div>
</div>

(最好将样式放在 CSS 文件中，使用类等。我使用 div，但与样式 LI 相同，只是您可能需要添加一个display:block 样式)。此外，如果单元格的内容可以有不同的高度，您可能还必须添加一个高度。