ヘッダーを固定する方法
Category:CSS 投稿日:2012年02月05日
▼概要
facebookのヘッダーのようにスクロールしても動かないヘッダーの作り方を説明します。
▼説明
cssに下記のようなプログラムを記述します。
div#header { width: 100%; /*ヘッダーの横幅に隙間ができないように設定*/ position: fixed; /*スクロールしても固定されたままに設定*/ z-index: 99; /*重なりの順序を整数で設定*/ }
上記のプログラムを加えるだけで、ヘッダーを固定することができます。
動作確認ブラウザ:IE7, Chrome16, FireFox10, Opera11
IE6は、上記のプログラム以外にもプログラムを記述しなければいけなかった気がします。まだ確認していません。