使用兩個頁腳粘腳的問題

我目前自我教學自己的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

使用兩個頁腳粘腳的問題

回答

相關問題