静态标题栏位于我的内容后面

本文介绍了静态标题栏位于我的内容后面的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我用代码创建了一个静态栏：

I created a static bar with the code:

#header_bar {
    background-image: url(../img/background_white.png);
    height: 64px;
    border-bottom: 0px;
    padding-left: auto;
    padding-right: auto;
    width: 100%;
    top: 0;
    position: fixed;
}

以及我的内容代码：

And my code for my content:

#content {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #D8F0DA;
    width: 100%;
    height: auto;
    min-height: 100%;
    position: relative;

    background-image: url(../img/wallpaper.jpg); 
    background-position:center center;
    background-repeat:no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-attachment: fixed;
}

它起作用了，我的标题栏变成静态的，但是当我向下滚动标题栏留在我的内容后面。如何解决这个问题？

It worked and my header bar became static but when I scroll down the header bar stays behind my contents. How can I fix this?

推荐答案

尝试添加 z-index 到标题栏的CSS类：

Try add a z-index to the header bar's CSS class:

position: fixed;
z-index: 100;

应该让它出现在内容的顶部。

Should make it appear on top of content.

这篇关于静态标题栏位于我的内容后面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！