css - 为什么这是错误的？关于底部的页脚

Question

我不明白。我编写的代码使页脚始终位于底部。让我们说粘页脚。这是我的代码。

 body {
       background-color: #edecd8;
       margin:0;
       padding:0;
        height:100%;

     }

       #container {min-height:100%; position:relative;}



      #body {
        padding-bottom:20px;
      }


    #footer {
      position:absolute;
      bottom:0;
      width:100%;
      height:20px;/* Height of the footer */
      background: #FC0;}

</style>

<div id="footer">  contact | the athens store | Mitropoleos 37    </div> 

使用这些代码效果不佳，实际上页脚不在底部而是高一点。然后我在最开始添加了一个像这样的 html 标签并且它起作用了!为什么之前错了？

html,body {
   background-color: #edecd8;
   margin:0;
   padding:0;
   height:100%;
  }

Answer 1

浏览器有一个默认的页边距和填充，这就是为什么你的栏下有一点空间，这就是为什么开发人员使用 css 重置来写这些。

或者使用简单的代码

如果你替换这个

html,body {
   background-color: #edecd8;
   margin:0;
   padding:0;
   height:100%;
  }

对此

* {
   margin:0;
   padding:0;
}    

body {
   background-color: #edecd8;
   height:100%;
}

它将工作并欠写所有默认的浏览器填充和边距