html - 修改为固定表头

Question

我想将我的旧网站模板标题修改为固定的。因此，每当我向下或向上滚动时，标题将保持在屏幕顶部。

我知道我只需要将 position: fixed; 添加到我的样式表中，但由于这是旧网站，当我添加此代码时，其余内容将上升并且标题位于内容。

有什么方法可以固定标题，但不让内容上去？

我尝试添加 margin-top: 50px 使页眉和内容仍然在原来的位置，但由于页眉是动态的(页眉的高度将根据用户而改变)，这方式将不太好用。

谢谢。

Answer 1

给body一个padding-top:50px来强制留空

如果标题的高度可变，您将不得不使用 javascript 为正文重新分配新的填充。

jquery解决方案

$(function(){
    $('body').css({'padding-top': $('#header').height()});
});