Para crear una cabecera que se mantenga fija mientras hacemos scroll solo necesitamos un poco de CSS:
<style type="text/css">
body{
margin:0;
padding:100px 0 0 0;
}
div#header{
position:absolute;
top:0;
left:0;
width:100%;
height:100px;
background-color:#333;
color:#FFFFFF;
}
@media screen{
body>div#header{
position: fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}
</style>
Siendo estos los DIV’s que contendrán tanto la cabecera como el contenido de la página:
<div id="header"> cabecera </div> <div id="content"> contenido </div>
Via: Anne’s Blog
