使用两个页脚粘脚的问题

我目前自我教学自己的Web开发。我从头开始重新创建一个网站。它应该是这个样子：使用两个页脚粘脚的问题

===========导航栏=============

======= ==网站身体===========

===========页脚＃1 ============

= ==========页脚＃2 ============

和我的基本代码结构是：

<body class="main-body"> 
    <form id="form1"> 
    <footer id="footerContainer"> 
     <div class="ContainerBlock"> 
     <section class="big-blue"> 
      <div class="Container"> 
      <div class="rows"> 
       <div>(these are columns)</div> 
       <div>(these are columns)</div> 
       <div>(these are columns)</div> 
       <div>(these are columns)</div> 
      </div> 
      </div> 
     </section> 
     <section class="copyrights"> 
      <div class="container"> 
      <div class="rows"> 
       <div> 
       <small>copyright text</small> 
       </div> 
       <div> 
       <a href="a link!!!"> 
        <img alt="im an image" src="im an image"/> 
       </a> 
       </div> 
      </div> 
      </div> 
     </section> 
     </div> 
    </footer> 
    </form> 
</body>

页脚1是列出的页面链接列表和页脚2是版权信息和一些交互式图像。页脚1是一个坚实的蓝色块，我需要它停留在页脚的纯色块上。

我已经尝试使用：

.footer 
{ 
position: absolute; 
bottom:0; 
}

和（这是它目前设置为）：

.footer 
{ 
position: relative; 
bottom:0; 
}

和：

.footer 
{ 
position: fixed; 
bottom:0; 
}

和：

#footer 
{ 
position: absolute; 
bottom:0; 
}

我已经改变了我的部分和页脚的位置摆弄。我已经玩过不断变化的填充值，但无论我做什么，它都坚定地放在页面中间。

，如果我同时设置了我的页脚到：

position:relative; 
bottom: 0;

然后页脚1粉碎尾2和看起来像垃圾。什么是干净的方式，既能够坚持到我的页面底部，无论多长时间，都不会破坏我的版权信息？

来源

2017-07-21 RaptorJesus

请添加代码片段到你的问题。 – aghilpro

.footer是指它的类footer

#footer指的是元素id为footer

footer指页脚标签元素

尝试

footer { 
    position: fixed; 
    bottom: 0; 
}

来源

2017-07-21 19:17:36

不幸的是，这并没有改变我的立场。 – RaptorJesus

你的问题不是很明确。如果您不需要表单，为什么使用表单标签？所以，如果你想所有的页脚固定在页面的底部，你必须添加以下代码：

＃form1 { position：fixed; 底部：0 }

如果3列浮动你需要使用clearfix这样clearfix-hack

来源

2017-08-02 08:01:27

使用两个页脚粘脚的问题

回答

相关问题