如何使用HTML和CSS中的html对象编写粘性页脚？

我正在为我正在设计的两个网站使用Less Framework 4.在这两种设计中,我想在文档的顶部和底部应用5像素边框.

问题是：由于应用于body的样式,我将border-bottom和border-top应用于html对象,因此底部边框永远不会粘在页面底部,就像在通常的粘性页脚情况下一样.

以下是两种情况的屏幕截图：

Belgian client http://f.cl.ly/items/2X2B0R2f053N0h1T1j3Q/prikonline.png

这是我用于html和body的(LESS)CSS：pastie.org/private/us5x1vhjnwzq6zsiycnu2g

html {
    border-top: solid @black 10px;
    border-bottom: solid @black 10px;
    background: url('img/bg.png') repeat;
}

body {
    width: @8col;
    margin: 0px auto;
    padding: 100px 48px 84px;
    background: @white;
    color: rgb(60,60,60);
    -webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
    font: 13px/20px 'OftenRegular';
    -webkit-tap-highlight-color: @green;
}

我尝试过使用身高：100％身体和html对象,但这里是它的外观：http://prikonline.be/prikactie/

我应该如何将边框粘贴到页面底部？

解决方法

您可以改为使用这样的页脚包装器.

.footer {
  position: absolute;
  bottom: 0;
  border-bottom: solid @black 10px;
  width: 100%;
}

并在< / body>之前插入此权利或某事

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