javascript - 其他 div 内的粘性页脚

标签 javascript css footer sticky-footer

我有一个给定的 HTML 结构,并不能真正设法改变它以将页脚放在包装 div 上,没有别的,所以“经典”粘性页脚代码不起作用。结构如下:

<body>
    <div></div>
    <div>
        <sidebar></sidebar>
        <maincontent>
            <div></div>
            <div></div>
            <div></div>
            <footer></footer>
        </maincontent>
    </div>
</body>

页脚必须存在,以便侧边栏通过 js 正确显示和消失,如果我将它放在它与粘性页脚代码一起使用的位置,侧边栏会出现在它上面,并且主要内容不会扩展到页面末尾。

除了更改所有内容之外,还有什么方法可以使页脚变粘吗?

最佳答案

如果你想让页脚贴在主要内容上,试试这个

#maincontent-selector {
    position: relative;
}

#footer-selector {
    position: fixed;
    bottom: 0px;
}

您的父元素应具有相对位置或绝对位置,以使页脚紧贴父元素底部。

否则它会粘在页面底部。

关于javascript - 其他 div 内的粘性页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27464847/

相关文章:

javascript - 如何停止 Django 线程

javascript - jQuery 背景图像 url

html - CSS 固定页脚, float 页眉

html - 在移动 View 中将页脚保留在页面底部

php - 将报告打印到纸上

javascript - 为什么我的 javascript 文件是唯一出现 404 错误的文件?

JavaScript:for..in 循环内的 else 语句破坏了我的 if 语句

javascript - Angular 和 React 等语言的 SEO 现状?

自定义 map 上的 Javascript 纬度和经度到像素

javascript - 如何删除或改进 :focus style on Bootstrap Carousel?