在设计网站的时候，如果你某个页面的内容没有满屏，那你的footer会离浏览器底部很远，整体看起来很难看，这里用JavaScript提供一种方法来将footer固定在浏览器底部。

function fixFooter(){
    var mainHeight = document.getElementById('main').offsetHeight;
    var  height = document.documentElement.clientHeight 
                         - document.getElementById("header").offsetHeight 
                         - document.getElementById("footer").offsetHeight;
    if(mainHeight  < height ){
        document.getElementById('main').style.height= height + "px";
    }
}

　　其中，main是你网页内容的id，header是菜单的id,footer是footer的id。当网站内容的高度小于多少时，那么获取header和footer的高度，并用document.documentElement.clientHeight减去他们，剩下的就是main的高度。
　　但是当你运行代码的时候，你会发现footer先是离底部有点距离，然后才到底部的，这样看起来很难看，可以加上下面语句隐藏这个过程，使得网页一打开footer就在底部。

document.getElementById('main').style.overflow="hidden";

　　当然，如果你想让footer一直在浏览器底部，那么可以通过CSS来解决

#footer{
　　position: fixed;
　　right: 0;
　　left: 0;
　　z-index: 1030;
　　bottom: 0;
　　margin-bottom: 0;
}

　　这样footer会一直在浏览器底部。

　　这里再提供一种方法：完全通过css达到的。

<footer class="footer">
      <div class="container">
        <p class="text">版权所有，翻版不究! </p>
      </div>
</footer>

下面是css：

html {
  position: relative;
  min-height: 100%;
}
body {
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  background-color: #f5f5f5;
}

.container {
  width: auto;
  max-width: 680px;
  padding: 0 15px;
}
.container .text {
  margin: 20px 0;
}

　　这样可以在页面文章内容没有满的时候一直使得footer在底部。