Bootstrapのフッターを修正しました

Bootstrapを試していますが、コンテンツがスクロールされた場合にページからフッターが消えることなく、下部のフッターを修正するにはどうすればよいでしょうか。

ビューポートの下部にくっつくフッターを取得するには、次のように固定位置を指定します。

footer {
    position: fixed;
    height: 100px;
    bottom: 0;
    width: 100%;
}

Bootstrapは、このCSSをクラスのNavbar> Placementセクションに含めfixed-bottomます。このクラスをフッター要素に追加するだけです。

<footer class="fixed-bottom">

ブートストラップドキュメント：https：//getbootstrap.com/docs/4.4/utilities/position/#fixed-bottom

これを追加：

<div class="footer navbar-fixed-bottom">

https://stackoverflow.com/a/21604189

編集：クラスnavbar-fixed-bottomはfixed-bottomBootstrapv4-alpha.6以降に変更されました。

http://v4-alpha.getbootstrap.com/components/navbar/#placement

これを追加：

<div class="footer fixed-bottom">

z-index:-9999;このメソッドに追加します1。そうしないと、トップバーがカバーされます。

これを行うには、次のIDスタイルを適用してページのコンテンツをdivでラップします。

<style>
#wrap {
   min-height: 100%;
   height: auto !important;
   height: 100%;
   margin: 0 auto -60px;
}
</style>

<div id="wrap">
    <!-- Your page content here... -->
</div>

私のために働いた。

その例を確認することをお勧めします：http： //getbootstrap.com/2.3.2/examples/sticky-footer.html