注文: ページの下部にフッターを保持したい場合 (ページ コンテンツの高さがウィンドウの高さより低い場合でも)、次の方法を試すことができます。
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>CSS让footer保持在页面底部</title> <style type="text/css"> * { margin: 0; padding: 0; } html, body { height: 100%; /*让页面撑满窗口*/ } .body { min-height: 100%; height: auto !important; height: 100%; /*设置页面内容区域最小占满窗口高度*/ margin: 0 0 -41px; /*利用margin负值留出footer的区域(由于footer设置了1px的border，所以值在原有高度上+1)*/ text-align: center; } footer { height: 40px; line-height: 40px; border-top: 1px solid #ddd; text-align: center; } </style></head><body> <div class="body"> <header>我是头部</header> <div>我是内容</div> </div> <footer>我是页脚，我总是固定在页面底部</footer></body></html>
著者: @zhnoah
出典:
この記事の著作権は私とブログパークに属します。ただし、この声明は著者の同意なしに保持され、原文へのリンクが提供されなければなりません。そうでない場合、当社は法的責任を追及する権利を留保します。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
