Html 页眉和页脚之间100%不滚动的内容

示例：www.mindout.com.br

我想在我的页面上有一个fullcontent无滚动条，但它不工作，页脚在内容下方，生成滚动条

图像变大并占据整个空间，将页脚向下抛

     <style type="text/css">.content{
    height: 100%;
    width: 100%;
    background: green;
    position: absolute;}.header, #footer {
    height: 100px;
    width: 100%;
    background: red;}body {
    height: 100%;
    width: 100%;
    background: blue;}​.look{width: 100%;height: 100%;}.bg1{
    background: #000000 url(./assets/bone1.jpg) !important;
    background-size: cover !important;
    height: 100%;
    width: 50%;
    display: block;
        float: left;
    }
.bg2{
    background: #000000 url(./assets/modelo1.jpg) !important;
    background-size: cover !important;
height: 100%;
width: 50%;
display: block;
    float: left;}

 <div class="content">
  <div class="header">
    <header class="site-header"> 
        <div class="header-wrapper">
            <div class="site-branding">
                <div class="site-logo">
                    <a href="https://www.mindout.com.br/" rel="home">
                        <img src="./assets/logo-transparente.png" alt="MINDOUT">
                    </a>
                </div> 
            </div>
            <div class="nav">
                <nav class="main-navigation-slices">                    
                    <ul class="menu-menu-primario">
                        <li><a href="http://www.mindout.com.br/">Home</a></li>
                        <li><a href="#">COLLECTIONS</a>
                        </li>
                    </ul>                
                </nav>    
            </div>
        </div>
    </header>
</div>
<div class="look">
    <div class="bg1"></div>
    <div class="bg2"></div>
</div>
<div class="footer">This is my footer</div>
</div>

.content{
身高：100%；
宽度：100%；
背景：绿色；
位置：绝对；}。页眉，#页脚{
高度：100px；
宽度：100%；
背景：红色；}体{
身高：100%；
宽度：100%；
背景：蓝色；}​.外观{宽度：100%；高度：100%；}.bg1{
背景：#000000URL（./assets/bone1.jpg）！重要；
背景尺寸：封面！重要；
身高：100%；
宽度：50%；
显示：块；
浮动：左；
}
.bg2{
背景：#000000URL（./assets/modelo1.jpg）！重要；
背景尺寸：封面！重要；
身高：100%；
宽度：50%；
显示：块；
浮动：左；}





这是我的页脚

您可以将正文或页面容器的高度设置为100vh，同时隐藏溢出，这将使页面的所有内容不高于浏览器窗口

然后包括标题和主标题

您的主要内容所在的主要元素应与浏览器高度一样大或更大。您可以通过将高度设置为100%强制执行此操作

最后，将页脚设置为在屏幕底部固定一个位置

我在下面包括了一个演示

正文{
高度：100vh；
溢出：隐藏；
保证金：0；
}
标题{
背景：蓝色；
}
页脚{
背景：红色；
底部：0；
左：0；
宽度：100%；
位置：固定；
}
主要{
身高：100%；
}
潘内尔先生{
浮动：左；
宽度：50%；
背景：绿色；
身高：100%；
位置：相对位置；
}
.中心{
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}

标题
窗格
窗格
页脚

您可以首先在正文中添加

边距：0

。当正文内容对于页面来说太长时，您预计会发生什么？嗨，pete，谢谢您的帮助，但是问题在于图像，如果我放置任何文本或其他类型的内容都没有问题，但是图像确实会创建更大的内容并生成滚动条，我想要的是页脚在图像上，而不生成滚动条。巴里仍然不明白，如果你的图像太大而看不见滚动条，这不是很糟糕的可用性吗？如果你对滚动条不感兴趣，那么只需定位你的页脚，然后隐藏你身体上的溢出-它很脏，但似乎适合你的需要在这个例子中，我想在这个例子中做同样的事情，但在这个例子中，它是一个购买的代码，我想做一本手册你想在那一页上做检查吗？或者搜索一些高度和宽度属性，查看它们如何与溢出和响应设计配合使用？