Web ページの下部にフッターを修正するにはどうすればよいですか?

フッターをページの下部に固定する方法

多くの Web サイトでは、フッターがページの下部に固定されていないという問題に遭遇します。ページ、特にコンテンツの量が少ないページ。画面サイズやコンテンツの長さに関係なく、フッターがページの下部に残るようにするには、次の CSS ソリューションを使用します。

#footer {<pre class="brush:php;toolbar:false">position: fixed;
height: 50px;
background-color: red;
bottom: 0px;
left: 0px;
right: 0px;
margin-bottom: 0px;

}

このコードは、次のプロパティをfooter:

• position: フッターの位置を固定に設定し、ページのスクロール位置に関係なく、フッターが所定の位置に残るようにします。
• height: 高さを指定します。 footer.
• background-color: デモ用にフッターの背景色を調整します。
• bottom: フッターの下端の位置を設定します。ページの下部から 0 ピクセル。
• 左:フッターの左端をページの左端に揃えます。
• right: フッターの右端をページの右端に揃えます。
• margin-bottom: 不要な下マージンを削除します。

コンテンツが固定フッターと重ならないようにするには、追加の CSS ルールを body 要素に適用できます:

body {<pre class="brush:php;toolbar:false">margin-bottom: 50px;

}
pre>

これにより、本文に 50 ピクセルの下マージンが追加され、固定フッター用のスペースが作成されます。表示されます。

以上がWeb ページの下部にフッターを修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。