我想在我的网站上设计一个设计,页脚总是出现在屏幕上,并浮动.当用户向下滚动时,页脚随之移动.我没有把自己的想法卖给自己 – 但这就是我认为我想要链接到公司的东西的地方.如果这是一个坏主意,请让我知道这些限制(在移动设备上可能?).
我已经看到设计和示例在页面底部有页脚,但如果“低于”,用户需要向下滚动才能看到它.不好.
有人能为我提供有关如何实现这一目标的基础知识吗?
提前致谢.
解决方法
Bootstrap有一个类可以做你想要的:.navbar-fixed-bottom.使用该类是更好的解决方案,因为您不需要自定义css.
但是,如果你确实想使用自定义CSS,那么就是这样的.假设您的页脚元素具有ID“页脚”:
#footer { position: fixed; width: 100%; bottom: 0; }
并且您必须确保当用户滚动到页面底部时,页脚不得贪图最低内容.为了避免这种情况,最简单的解决方案是将底部边距添加到与底脚高度相同的量的body元素中.假设您的页脚元素高100像素,您可以使用以下代码:
body { margin-bottom: 100px; }
但为了确保避免页脚重叠,您必须使用jQuery更新屏幕尺寸更改时的主体底部边距,因为页脚高度可能会发生变化,尤其是在响应式布局中.