ベストアンサー

webページのヘッダーについて

2012/05/17 15:35

最近のブログでは上部に固定されたバー(画像みたいな)がありますがあれはどうやって作っているのでしょうか？　よかったら詳しく乗っいているホームページ等を教えて下さい。HTMLソースなどが詳しく乗ってれば更にありがたいです。

takuya12421242
お礼率96% (494/514)

CSS
回答数1
ありがとう数4

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

ORUKA1951
ベストアンサー率45% (5062/11036)

2012/05/17 19:05 回答No.1

固定と言うのはどういう意味でしょうか？スクロールしても常に最上部にあるということ？それとも単に一番上にあるということ？ HTMLソースは関係ありません。たとえ下のほうにあっても・・ <body> <div class="header"> <h1>タイトル</h1> </div> <div class="section"> <h2>記事見出し</h2> <p>本文</p> <p>本文</p> </div> <div class="footer"> <h3>文書情報</h3> <p>・・・</p> <p class="siteLogo">FCブログ</p> </div> </body> だとして、スタイルシートで absoluteでトップ,fixedで固定(印刷時には各ページに印刷) html,body{margin:0;padding:0;} div.header,div.section,div.footer{margin:0;border:solid 1px gray;} div.header{background-color:yellow;} div.section{background-color:rgb(255,255,200);height:80%;} div.footer{background-color:pink;} div.footer p.siteLogo{ position:absolute; /* position:fixed; */ top:0;left:0;width:100%; height:80px;line-height:80px; font-size:60px;font-weight:bold; background-color:silver; }

質問者