Tag: 粘性页脚

如何创build与Bootstrap 3兼容的粘性页脚

有或没有顶级的导航，网站有一个粘性页脚是非常普遍的。 Bootstrap有一个设备可以轻松地创build固定的页脚，但是没有创build粘性页脚的设备 – 这是一个很大的区别。 谷歌search这个问题将揭示数百人，如果不是成千上万的开发者有相同的问题，但没有很好的答案。 具有讽刺意味的是， 引导文档页面本身有一个粘性的脚注，引导样式和一个固定的顶级导航栏。 这是所有的自定义CSS虽然，而不是框架的一部分。 所以一个显而易见的路线是采取和重构他们的自定义样式，因为它明显地在Bootstrap框架内运行良好，但是这似乎比它应该更痛苦。 看到这个plunkr的示例页面，带有Bootstrap顶部导航栏，以及一个不受欢迎的，不粘的页脚。 问题： （感谢Softlayer – 为graphics ） 期望的解决scheme： 当然，页脚应该是响应式和跨浏览器友好的

我的页脚漂浮

我一直在尝试各种“粘”的页脚解决scheme，在三天的较好的一部分，没有成功。 我试图将页脚放在浏览器窗口的底部，当没有足够的内容存在时跨越窗口的整个高度。 请。 帮帮我。 这里是基本的网站结构： <div id="siteWrapper"> <header> <div id="header"> <div id="headerWrapper"></div> </div> </header> <div id="content"> <div id="innerWrapper"> <div id="columnLeft"></div> <aside> <div id="aside"> <div id="asideWrapper"></div> </div> </aside> </div> </div> <footer> <div id="footer"> <div id="footerWrapper"></div> </div> </footer> </div> 而关联的CSS，为简洁编辑，也没有反映任何我试过的解决scheme（见下文）： * { margin: 0; padding: 0; } #header { width: 100%; display:inline-block; } #headerWrapper { width: 90%; […]