<div id="header">
ヘッダー
</div>
<div id="contents">
<a href="#page-link">リンク</a>
<div name="page-link" id="page-link">
<div class="box">コンテンツ部分</div>
</div>
</div>
/* リセット */
*{
padding:0;
margin:0;
}
/* 今回の指定 */
#header {
width: 100%;
height: 30px;
position: fixed;
left:0;
top:0;
z-index: 10;
background:#ccc;
padding:10px;
}
#contents {
padding-top: 50px;
}
#contents a{
display:block;
background:#fff;
color:#333;
padding:10px;
}
#page-link {
margin-top:-50px;
padding-top:50px;
}
#page-link .box{
height:500px;
background:#333;
color:#fff;
padding:10px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.