Html 计算的列宽不同于css声明的列宽。浏览器如何决定宽度？

假设我有一个html表，css声明的宽度为750px。它有5列，每列的宽度为50px，使用css声明（所有td的宽度均为50px）。显然，列的宽度之和是250px，小于750px

浏览器呈现表格时，每列的计算宽度不同。我有一个列，它只有5个空格，但计算出的宽度超过100px（远远超过5个）

所有列都适合其包含的文本加上一些额外的空格。标记中没有硬编码的列宽。“td”的css中只有一个50px

---

浏览器如何计算每列的渲染宽度？

这称为长方体模型。填充和边框将添加到元素宽度中。因此，一个带有

填充的DIV元素：10px；宽度：50px；边框：1px纯黑的宽度实际上是72像素。我希望您的td有边框或填充？
浏览器尝试在表格宽度内填充单元格，根据需要扩展/收缩
td
s

所以，你把桌子设置为750px，但只给出了250px的宽度。在这种情况下，浏览器将采用其传统的间距方案，根据每个单元格中的内容，尝试均匀地隔开单元格

您可以阅读更多有关此操作的信息。
当您设置表列的宽度时，它只是一个建议的最小宽度，如果可能的话，浏览器会尝试遵守该宽度。列的实际宽度是根据其内容的大小来计算的，将列之间的剩余空间平均分割

如果任何列的宽度最终小于您指定的宽度，则如果其他列中有可用空间，浏览器将尝试调整该宽度，但在您的情况下，这些列已超过最小值

计算单元格大小的实际算法因浏览器而异，这意味着根据您使用的浏览器的不同，列最终会略有不同。
您需要使用
表格布局
样式。有3个可能的值：


自动
。默认值。宽度取决于内容
已修复
。取决于CSS中规定的宽度
继承
。从其父级继承该值

在您的情况下，您需要在表元素上使用
表布局：修复了
。
在处理表时，边框折叠也起作用。无边框。没有填充物。无间距。每列中的最长内容小于计算的宽度。每列都有额外的空间。没有一列比我的宽度窄。浏览器是否尝试在每一列中均匀地添加额外的空格以达到表的宽度？这里的关键字也一样。我有一个列，它只有硬编码的空格，没有文本，但最后它的列比空格的总和还要宽。@Tony_Henrich:是的，根据浏览器中的一些未知算法，额外的空格被等分或按比例分到各个列上。