css内容放底部

HTML

<body>
  <div class="footer">footer</div>
<body>

CSS

.footer {
      position: absolute;
      width: 100%;
      height: 20px;
      line-height: 20px;
      background-color: #eee;
      bottom: 10px;
    }

我不明白为什么这样也可以让footer在页面的底部？

因为现在footer是相对于body进行定位的，但是现在body的高度是0，为什么现在footer还是在页面的底部了？

当footer没有已定位了的父元素时，其实是相对于body还是html来进行定位的？应该是body吧？

css

阅读 3.4k

4 个回答

王能全是谁

✓ 已被采纳

html，body默认static的情况下，包含块是初始包含块，这个包含块就是视口
css2.1

The containing block in which the root element lives is a rectangle
called the initial containing block.For continuous media, it has the dimensions of the viewport and is anchored at the canvas origin;