上部にレクタングルのメニューを固定したい、そう思って調べてみました。
スマートフォン向けのサイトを作成していて、上部にメニューを固定させておきたいのですが、検索するとjqueryで〜と書いてあったのですが、別に固定させるだけであればcssで実装できたので、メモがてら記録しておきます。
header要素でトップを作って固定する
<header>
<div id="inner">ああああ</div>
</header>
そして、css側では以下のように記載します
header{
height:42px;
}
header>div#inner{
width:100%;
height:42px;
position:fixed;
top:0;
left:0;
z-index:100;
background-color:red;
}
ひとまずこれで上部は固定されました。サイズとか、divの中は適宜変更で。