如何使用 CSS 格式化表格：
表格在屏幕内，浏览器的水平滚动条不显示，用户无需水平滚动即可看到表格的右侧；
单元格根据需要使用尽可能多的宽度，包含仅具有诸如“1”、“21”之类的数字的单元格的列将不会使用比显示该列中所有单元格中的所有数字所需的宽度大得多的宽度，例如4个字符宽度，即使用多于它意味着浪费水平空间；
对于包含非常宽的单元格的列，或者更准确地说，如果允许将占据较大宽度的内容，请使用尽可能多的宽度，以便不违反 1) 和 2)，并且如果单元格的全部内容无法显示，让该单元格显示水平滚动条。
这在 Windows 和 Mac OS X 上最新的 Firefox 和 Google chrome 的 CSS 中可行吗？
我的第一次尝试是基于CSS：Constrain a table with long cell contents to page width? , 使用嵌套div的 s 和position: relativethen position: absolute。不考虑绝对定位的 div 的大小，这对表格的宽度有利，但对行的高度不利：它不会扩展到包含滚动条。
然后我按照如何设置 <td> 宽度以在视觉上截断其显示的内容中的建议进行尝试？ . 这也实现了忽略单元格内容大小的目标，但这样做使我们无法像以前一样指定最后一列应该占据所有剩余宽度。table-layout: fixed
另请参阅：为什么溢出：隐藏在 <td> 中不起作用？.
这些提示可能会有所帮助：
1-不要为您的单元格指定任何宽度 2-当您自动插入页面时，会创建一个样式并分配给它，上面写着：宽度：100%；
继续删除它。这样，您的表格将变得非常小并适应单元格的内容。
3- 将单元格的 nowrap 属性用于要保留在一行中的字段，例如数字，但不要将其设置为较大的文本并允许它是多行的。
4-您可能想要为表格设置宽度或将表格放在面板中并为面板设置宽度。
我不确定如何仅显示一行的滚动条，但我认为如果您以多行显示它们，则不需要该选项。