如何将HTML表格宽度限制为屏幕宽度的95%？

如何将HTML表格宽度限制为屏幕宽度的95%

我正在使用

<style type="text/css">
table {
  max-width:95%;
  border-collapse:collapse;
  ...
}
...

桌子{
最大宽度：95%；
边界塌陷：塌陷；
...
}
...

---

但生成的HTML页面的表格宽度大于屏幕宽度（1440x900屏幕），页面底部会出现一个滚动条

最大宽度不能应用于表标记。改为使用宽度

<table>
<tr>
    <td>test</td>
</tr>
</table>​

table {
  width:95%;
  border-collapse:collapse;
}

td {background:red;}

测试
​
桌子{
宽度：95%；
边界塌陷：塌陷；
}
td{背景：红色；}

有一些变通方法可以应用最大宽度效果，在“css表格最大宽度”上进行谷歌搜索。

使用该样式

width: 95%;

相反。另外，根据你的意图，考虑样式

width: 100%;
margin-left: 10px;
margin-right: 10px;

---

为了更好的布局。我在这里只是猜测，但是把桌子和窗户边缘之间的距离固定下来似乎是个好主意。否则，当您调整大小时，边距将动态更改。

添加到Konrad Viltersten后，我会将宽度设置为95%，但不是使用10px左右边距，而是使用：

margin-left: 2.5%;
margin-right: 2.5%;

---

调整浏览器窗口大小时，这将消除任何定位问题。

链接：我正在使用Chrome31检查您的桌子，这不会从上方限制桌子大小--注意，您可以侧滚。无论您如何限制td宽度，即使使用px，都会发生这种情况。你的测试数据是不现实的。如果存在这样的数据，则必须显示这些数据，然后选择不同的元素（如DIV）是更好的解决方案。尝试此方法后仍然无效，这意味着表格仍然比屏幕宽，并且底部会显示一个滚动条。这是否取决于单元格内容的干净程度？打开一个新项目并放入表格。还是太宽了吗？如果是这样，你就有一些问题了。最有可能的是，它将正确显示。然后，通过一次添加每个组件（或几个组件，这样您就不会发疯），您可以跟踪错误发生的位置。或者，您可以复制项目并将其剥离，直到错误消失。找到冒烟的枪后请给我们回电话。我的猜测是，一种风格是在不知不觉中继承下来的。（我总是在CSS'ing的时候做出这样的猜测）。这似乎是由于存在样式为

tr td div.longcell{height:190px；overflow-y:scroll；}

的单元格造成的。但我不知道怎样才能把它修好。当

和

的内容行太宽时，就会出现上述问题。是否需要在那里“滚动”？“隐藏”就足够了吗？隐藏是行不通的。查看器需要查看单元格的内容。他们可以向下滚动查看默认情况下未显示的任何内容。请张贴小提琴好吗？我可以做一些调整，然后发布更新。否则，我不确定如何使用嵌套等方式设置元素，这可能会改变为特定表执行此操作的方式。