0

代码见链接...

使用此代码，页面在调整大小时也为我提供了适当的宽度。但是高度必须用 jQuery 来调节。这给了我一个 div，其中高度比我想要的 100% 高一点，并且在调整页面高度时不会改变......

Here is the code: http://jsfiddle.net/T6Uv4/

4

2 回答 2

0

这取决于您要执行的操作。但如果你改变position: absolute;它position: fixed;应该像页面一样调整大小。

但是，如果您在页面上有滚动条，那么您可能不希望它停留在页面上的相同位置。

它不是动态的问题，position: absolute;因此如果您更改浏览器大小，它会保持其原始大小，就像页面首次加载时一样。如果您在更改浏览器后 CRTL+F5 页面，内容将弹出到它应该出现的位置position: absolute;

这是一个position: relative; Jsfiddle

这是您的jQuery代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  var windowHeight = $(window).height();
    $('#content').css({'height':windowHeight+'px'});
});
</script>

这更多是您想要的吗？

新的 jsfiddle 更新：更新的小提琴

您需要删除主体填充和边距以及容器周围的边框。

于 2013-04-12T12:49:19.710 回答
0

我试图解释这种行为：

如果您的屏幕分辨率为 1000px（仅作为示例），则 80% 为 800px。但是如果将页面大小调整为 500 像素宽，则 80% 的页面会捕获 400 像素。那些 400px + 210px 边距= 610px（不是 500px！）

解决方案：尝试将 leftmargin和 yourpadding放在 porcentual 值或 em 单位中，以使内容内的边距调整大小。

这是一个小提琴。

请注意，当您调整屏幕大小时，滚动条会再次出现。您可以修复它，将边框更改为em单位。完美的解决方案是在整个页面中设置没有固定值。

对于更复杂的尺寸调整，您可以使用Mediaqueries

于 2013-04-12T12:50:33.350 回答