-1

我正在尝试优化我的网站以适应不同的屏幕和窗口大小。我希望 div 的内容占据浏览器高度的 100%，而不是更多，这样用户就不必向下滚动。我不知道如何实现这个，我试过这个

$(window).on('load resize', function(){
    $('.container-narrow').width($(this).width());
    $('.container-narrow').height($(this).height());
)};

但这似乎不起作用，内容仍然超过浏览器高度。我必须结束滚动

4

1 回答 1

0

CSS 将在调整大小时重新计算。

<html>
<head>
<style>
body, html {
 height: 100%;
 margin: 0px;
 padding: 0px;
}
.body {
 height: 100%;
 margin-bottom: -100px;
}
.header {
 height: 100px;
 background-color: #CCCCCC;
 text-align: center;
}
.content {
 text-align: center;
}
.footer {
 height: 100px;
 text-align: center;
 background-color: #AAAAAA;
}
</style>
</head>
<body>
<div class="body">
    <div class="header">
    This is the header.
    </div>
    <div class="content">This is the content.</div>
</div>
<div class="footer">
This is the footer.
</div>
</body>
</html>
于 2013-01-29T02:09:57.453 回答