html - 修复html中页眉和页脚位置的问题

Question

我在 index.html 页面上放置了页眉和页脚的网格视图缩略图图像很少，因为即使页眉和页脚滚动网格图像也会滚动，我给出了 Position:fixed; 属性仍然不固定。如果我按其他页面并返回然后页眉和页脚是固定的，而不是在应用程序启动时。

CSS代码

#Header { background: #8C001A; 
height: 36px; padding: 0; border-bottom: 1px solid    #3c3c3c; 
 z-index:101; 
 top: 0;
 bottom:80px;
 left: 0;
position: fixed;
right: 0; } 

#Footer { background: #8C001A;
 height: 30px;
 padding: 0; 
 border-bottom: 2px solid #000; 
  z-index:101; 
 bottom:0px;
left: 0;
position: fixed;
right: 0; 
bottom: 0;}

html代码

 <div id="Header"> </div>

 <div id="Footer"> </div>

Answer 1

CSS

body{
   padding:0px;
   margin:0px;
}
#Header {
   background: #8C001A; 
   height: 36px; padding: 0; border-bottom: 1px solid    #3c3c3c; 
   z-index:101; 
   top: 0;
   bottom:80px;
   left: 0;
   position: fixed;
   right: 0; 
} 

#Footer { 
  background: #8C001A;
  height: 30px;
  padding: 0; 
  border-bottom: 2px solid #000; 
  z-index:101; 
  bottom:0px;
  left: 0;
  position: fixed;
  right: 0; 
  bottom: 0;
}

#container{
  height:1600px;
  background-color:#00ffff;
}
#container1{
  height:1600px;
  background-color:#ffff00;
}

HTML

<div id="Header"> </div>
<div id="container"></div>
<div id="container1"></div>
<div id="Footer"> </div>

请尝试此代码，我的身边工作所有浏览器