ヘッダーの固定は position: fixed; で可能です。
固定したい場所を < div > などでまとめ、そのエリアを position: fixed; で固定するとスクロールしても固定した部分はそのままついてくるようになります。
注意しなければいけないのが固定したあとのメインの位置も設定しなければならないということ。
メインの位置を設定しないとヘッダー部分とメインの上部が重なってしまいます。
メインの位置は margin-top で指定してあげます。
固定する部分の大きさに合わせて margin-top の px を調節しましょう!
例(html)
/*ヘッダーエリア*/
< div id="headerarea" >
< img src="画像URL" alt="ヘッダー" >//ヘッダーに設定したい画像
< /div >
/*メインエリア*/
< div id="main" >
//ここに文字とか画像とかいれる
< /div >
例(css)
/*ヘッダー固定*/
#headerarea {
position: fixed;
top:0px;
}
/*メインの位置*/
#main {
margin-top: 100px;
}
※< >の前後の半角スペースは抜いてください。
簡単にヘッダー部分を固定できるようになります。