HTML和CSS为了修复网站的页脚内容

-1

任何人都可以教我如何创建一个页脚div，它始终停留在网站的底部，不管中间有多少信息，最重要的是这里是我没有固定中间内容的任何高度属性（请注意，这是“网站”而不是“窗口”，因为我不想固定页脚，强制用户每次向上滚动时都会看到页脚或向下滚动到我的网站）一个特定的例子就像Facebook一样，无论您点击旧帖子按钮多少次，页脚始终位于页面末尾。无论如何，HTML和CSS甚至JavaScript都可以做到这一点。请帮助我，并且非常感谢你的进步！HTML和CSS为了修复网站的页脚内容

来源

2012-01-08 Eli

这是非常基本的HTML。 Google会在几秒钟内为您提供解决方案。 – Scott 2012-01-08 09:16:16

我以前用过stickyfooter。您可以在这里了解到它http://ryanfait.com/sticky-footer/

来源

2012-01-08 09:16:09 mrmo123

您将页脚内容放在其他内容之后。就这样。

（除非您需要处理位于正常流程之外的早期内容，并且处于浮动状态等）。

来源

2012-01-08 09:18:11 Quentin

一种方法是使用带有页脚div的母版页。请看这篇MSDN文章以获取更多信息：http://msdn.microsoft.com/en-us/library/wtxbf3hh.aspx

来源

2012-01-08 09:19:01 Veronica

如果您希望页脚被压低到窗口的底部（如果内容不足以填充窗口），请使用this article。

总结文章：

创建周围的页面元素的包装：

<div id="container"> 
    <div id="header"></div> 
    <div id="body"></div> 
    <div id="footer"></div> 
</div>

使用CSS，给身体100%高度，给容器position：

html, body { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
} 
#container { 
    min-height: 100%; 
    position: relative; 
}

再次使用CSS，得到内容（在这个例子中，#body），包含页脚的高度padding-bottom和在bottom: 0页脚绝对定位：

#body { 
    padding-bottom: 60px; /* Height of the footer */ 
} 
#footer { 
    position: absolute; 
    bottom: 0; 
    width: 100%; 
    height: 60px; /* Height of the footer */ 
}

重要的是页脚有一个固定高度（即在px或em）。

这里你可以看到这个技术的演示：http://jsfiddle.net/PPvG/F7Fph/

来源

2012-01-08 11:12:31 PPvG

HTML和CSS为了修复网站的页脚内容

回答

相关问题