管理栏和固定标题问题？

我将标头设置为固定的顶部位置。登录到wordpress时，wp管理员导航栏覆盖了标题的顶部，使得无法访问顶部导航。我希望wp管理员导航将我的顶部导航推到下面，因此两者均可见。有人知道解决此问题的任何解决方案吗？

我的问题的示例可以在以下网站找到： www.nickriversdesign.com/dev

在您的css中，您可以尝试类似的操作：body.logged-in{margin-top:20px;}或如果使用.logged-in类的其他代码不起作用

尝试将其添加到您的CSS文件中：

body.admin-bar #branding-wrap{top: 28px;} 
body.admin-bar #wrapper{margin-top: 145px;}

body.admin-bar前面的声明将确保仅在管理栏可见时才应用这些样式。

我相信，在宽度较小的设备上，wpadminbar的位置不是固定的。因此，如果您在智能手机中滚动文档，则管理栏将跟随滚动，并且不会停留在窗口顶部。请牢记这一点，为什么不在wp_head()调用之后在主题的页脚中添加一些JavaScript 。这样，我们可以确定设备的宽度以及文档是否具有管理栏。然后只需制定一些CSS规则，然后将其附加到文档头即可-如下所示！

<script>
( function(e) {
    var ab = document.getElementById( 'wpadminbar' );
    if ( typeof( ab ) === 'object' && window.innerWidth >= 610 ) {
        var abh = ab.offsetHeight || ab.clientHeight || ab.scrollHeight;
        var style = document.createElement( 'style' );
        style.id = 'adminbar_main_nav_controle_rules';
        document.getElementsByTagName( 'head' )[0].appendChild( style );
        var rules = document.createTextNode( 'body.admin-bar .main-navigation.fixed { margin-top: ' + abh + 'px !important; }' );
        style.appendChild( rules );
        console.debug( 'wpadmibar space is covered' );
    }
})();
</script>

假设您的导航器有一个类，'main-navigation'并在滚动时添加另一个名为'fixed'它的类。通过替换'body.admin-bar .main-navigation.fixed'为您要定位的CSS来更改CSS以定位导航面板。

它可以进一步改进，例如检查管理栏是否固定，但是目前，希望对您有所帮助。

尝试使用WordPress 4+。它检查是否存在管理栏，如果有，将固定标题向下移动一点以进行补偿。

    //fix for admin bar
    if ($('#wpadminbar')[0])
        $('.site-header').css('top', '32px')

这也很好

body.logged-in > header {  
    margin-top: 32px;  
}  

我只是用这个CSS。

body.admin-bar #main-header  {
padding-top: 32px }

试试这个，很好

$(document).ready(function() {
    if ($('#wpadminbar')[0]) {
        $('header').css('top', '32px')
    }
});

给顶级导航栏

.navbar-fixed-top {
    border-width: 0 0 1px;
    padding: 0;
    position: relative!
}