哪个是指定 HTML 固定列宽（宽度或样式属性）的更好方法

Posted 2023-03-06

【中文标题】哪个是指定 HTML 固定列宽（宽度或样式属性）的更好方法

【英文标题】：Which is the better way of specifying HTML Fixed Column width (width or style attribute)

【发布时间】：2010-12-04 04:18:23

【问题描述】：

我想问一下指定html列宽的更好方法是什么？宽度属性还是样式属性？假设我使用的是 IE 6。IE 渲染宽度属性是否优于样式？

按宽度属性

<table >
    <tr>
        <td >A</td>
        <td colspan="2" >B&C</td>
    </tr>
    ....
</table>

样式属性的OR

<table style="width:900px;">
    <tr>
        <td style="width: 450px;">A</td>
        <td colspan="2" style="width: 450px;">B&C</td>
    </tr>
    ....
</table>

【参考方案1】：

首先在我回答你的问题之前，你应该知道表格是如何呈现的，尝试表格元素的表格布局固定样式：

如果浏览器预先知道第一个表格行列的宽度（如果您在表格上提供表格布局固定样式），则浏览器甚至可以在计算任何结果行的宽度之前开始渲染表格顶部。这意味着什么？由具有固定布局的 Ajax 调用填充的表可以在完整的 ajax 调用完成之前开始向用户显示结果。考虑这一点的最佳方式就像是渐进式 jpg。最后，您的页面似乎加载速度更快。

table

table-layout:fixed;

现在回答你的问题。

实际上，您提供的示例都不正确。您通常不会在跨越 2 个或更多单元格的单元格上设置宽度。在任何表格中，最好用所有单元格创建至少 1 行，这可以在 TH 中或（就像我喜欢在空白 tr 中那样。

例如...

<table>
<tr>
<td ></td>
<td ></td>
<td ></td>
</tr>
<tr>
<td>content here</td>
<td colspan="2">content here</td>
</tr>
</table>

无论您决定使用样式还是仅使用标准 html 宽度，您都可以选择，但最终您应该拥有第一行（如果表格布局固定）或任何行（如果表格布局不固定）包含每个单独单元格的宽度定义。这也将帮助您规划正确的表，希望这会有所帮助。

通过创建一个像 10 000 行的巨大表格来测试固定的表格布局，并测试渲染速度与非固定表格布局。

我认为关于 HTML 4 与 XHTML、样式与属性的整个争论实际上是可维护性的问题。我认为使用样式设置宽度或使用 HTML 4 过渡的普通宽度设置宽度没有任何问题，它们都做同样的事情。你可以同时做这两个的原因是因为 HTML 已经进化了一点，是的，它可能会变得混乱！祝你好运

【讨论】：

嘿，谢谢！我不知道 table-layout:fixed。

【参考方案2】：

只需在<td> 内添加<div> 标签或<th> 在<div> 内定义宽度。这将对您有所帮助。没有其他工作。

例如。

<td><div style="width: 50px" >...............</div></td>

【讨论】：

您好，欢迎来到我们的网站。请不要用重复的答案（例如 ^^^ 和 this）向已接受答案的旧问题发送垃圾邮件。如果您这样做，那么这两个问题可能都是重复的，因此请这样标记。在这些情况下，问题得到了愉快的解决，所以除非您有任何全新的内容要添加，否则我建议您提出新的和未回答的问题。谢谢。