0

可以覆盖身体宽度，例如我有这个例子：

<body>
<table id="table1">
<tr><td></td></tr>
</table>
<table id="table2">
<tr><td></td></tr>
</table>
</body>

css:
body{width:970px;}
#table1{width:100%;}
#table2{width:100%;}

我想为第一个表设置宽度：自动；可在整个浏览器宽度上展开，但正文宽度不允许。

我必须有那个 body:970px 所以我不能修改它，并且我必须有 100% 的第二个表才能以 970px 的主体宽度展开内部的所有元素。

我该如何解决这个问题？

小提琴示例

4

2 回答 2

1

没有好的方法可以做到这一点；HTML 元素总是从其父元素继承属性。所以如果你给body一个固定的宽度，你基本上限制了孩子们可以做的事情。对他们来说，世界（即width: 100%）现在是有限的body宽度，没有办法说“请使用父宽度但跳过正文元素”。

使用 JavaScript，您可以尝试获取html元素的宽度，但即使您将其分配给table1，溢出规则也可能会剪切它。

要解决此问题，您将不得不摆脱固定的车身宽度。div将 body 替换为固定宽度的容器。这使您可以移动table1到容器之外div，它将看到body的自然宽度。

于 2012-08-09T11:57:26.020 回答
0

因为你说：我必须有那个 body:970px 所以我不能修改它，我想你不能修改 body CSS：你可以这样做：

CSS

#table1, #table2 {width:970px;}

或者

jQuery

$(document).ready(function(){
$('body').css('width', '970px');
})
于 2012-08-09T11:47:55.267 回答