javascript - 如何使标题在 wordpress 中保持粘性

Question

这是我网站的链接http://www.expresskerala.com .在这个网站上，我需要使标题变粘。有什么方法可以使它变粘吗？我试过这段代码。

.site-header {
    background: #e5e5e5 none repeat scroll 0 0;
    position: fixed;
    width: 100%;
    z-index: 99 !important;
}

但是当我使用这段代码时，其他内容会下降。有什么解决办法吗？这也应该是响应式的。

Answer 1

由于 position:fixed 元素被从文档流中取出，您需要添加一个等于 .site-header 高度的上边距到下一个元素。您还需要添加 top:0 以将 .site-header 固定到文档的顶部。

.site-header {
    background: #e5e5e5 none repeat scroll 0 0;
    position: fixed;
    width: 100%;
    z-index: 99 !important;
    top: 0;
}
.site-header + * {
    margin-top: 240px; 
    // you should change this using media queries if the site-header height changes
}