html – 向空表格单元格添加文本会更改其宽度

概述有人能解释一下这里发生了什么吗？ http://jsfiddle.net/BeQmw/2 我有两个表,每个表有两行和两个单元格.每个单元格都有不同的背景颜色,因此您可以看到它们的宽度.两个表之间的唯一区别是第二个表在第二行的第一个单元格中有一个字符.但是当发生这种情况时,包含该列的细胞变得更宽. 为什么HTML会这样做有充分的理由吗？有没有办法指定所有单元格的宽度相同？ 默认情况下,< table 有人能解释一下这里发生了什么吗？ http://jsfiddle.net/BeQmw/2

我有两个表,每个表有两行和两个单元格.每个单元格都有不同的背景颜色,因此您可以看到它们的宽度.两个表之间的唯一区别是第二个表在第二行的第一个单元格中有一个字符.但是当发生这种情况时,包含该列的细胞变得更宽.

为什么HTML会这样做有充分的理由吗？有没有办法指定所有单元格的宽度相同？

解决方法 默认情况下,< table>将表格布局设置为auto.该设置使浏览器基于单元格的内容计算表格单元格的布局(即,具有内容的单元格与不具有内容格式的单元格不同地受影响).我不确定该算法究竟是什么,但是如果你没有在< table>上指定wIDth = 100％.元素看起来空表格单元格的1或2像素宽度显然会乘以表格的整个宽度.当您向第一个表格单元格添加内容时,这会继续减少,但随着内容在第二个表格单元格中的增加而增加.

我将切入追逐并说表格布局：固定不依赖于单元格内容并根据指定的宽度< col> s,边框和单元格间距计算表格单元格的宽度. (Specification)你可以看到这个在行动：http://jsfiddle.net/ExplosionPIlls/BeQmw/3/

规范继续谈论表格布局：auto并且实际上说：

UAs are not required to implement this algorithm…

所以没有保证表格单元格的特定宽度.

总结

以上是内存溢出为你收集整理的html – 向空表格单元格添加文本会更改其宽度全部内容，希望文章能够帮你解决html – 向空表格单元格添加文本会更改其宽度所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。