Bootstrap全寬頁腳沒有修復

我有創建全寬頁腳的需求。但它不應該固定在屏幕上。只有當您滾動到頁面底部時，它纔會顯示。Bootstrap全寬頁腳沒有修復

使用navbar-fixed-bottom會使頁腳完全變寬，但它也會將其固定到屏幕上。

<nav class="navbar navbar-default navbar-fixed-bottom" id="footer_nav"> 
      <div class="container-fluid footer_c"> 
       <ul class="nav navbar-nav"> 
        <li><a style="color:#4b4b4b; font-size:0.9em;" href="/ContactUs.aspx">Contact us</a></li> 
       </ul> 
      </div></nav>

有人可以讓我怎麼做。

來源

2016-09-28 Anshu

你的HTML代碼在哪裏？ –

更新了問題 – Anshu

我不認爲bootstrap會給你非固定的頁腳。您可以使用簡單的行類或重寫CSS頁腳類

HTML

<footer> 
    <div class="container-fluid footer_c"> 
    <ul class="nav navbar-nav"> 
     <li><a style="color:#4b4b4b; font-size:0.9em;" href="/ContactUs.aspx">Contact us</a></li> 
    </ul> 
    </div> 
</footer>

CSS

footer{ 
    width:100%; 
    height:20%; //your desired height 
    position:absolute; 
    bottom:0; 
    left:0; 
    background-color:green; 
}

CodePen：http://codepen.io/anon/pen/KgqWaV

來源

2016-09-28 06:00:22

一般來說引導頁腳將有position: fixed風格在課堂上。這就是在頁面底部粘貼頁腳的原因。您需要做的是通過在頁腳中添加樣式position: relative;來覆蓋頁腳的位置。這將使頁腳結束頁面的底部。

就在你的CSS

.navbar-fixed-bottom, .navbar-fixed-top { 
    position: relative; 
}

來源

2016-09-28 06:00:43 Nitheesh

它使頁腳消失，在一個較小的屏幕 – Anshu

請檢查您是否有任何媒體查詢頁腳。一般來說，上述線條不會隱藏較小設備中的頁腳。 – Nitheesh

不像.container類具有固定的寬度（該值取決於屏幕/窗口的大小），類.container-fluid會給全寬屬性添加這種風格。

<footer class="container-fluid"> 
</footer>

來源

2016-09-28 06:01:14 1GR3

Bootstrap全寬頁腳沒有修復

回答

相關問題