网页上的神秘边距

Question

我正在开发一个 Wordpress 主题，我注意到整个页面的主体都被压低了一点。我用Chrome中的inspector来查找问题，发现了以下样式：

<style type="text/css" media="screen">
    html { margin-top: 32px !important; }
    * html body { margin-top: 32px !important; }
    @media screen and ( max-width: 782px ) {
        html { margin-top: 46px !important; }
        * html body { margin-top: 46px !important; }
    }
</style>

如果我在检查器中删除它，页面正文将回到顶部。但奇怪的是。我尝试删除整个样式表以查看问题是否出在 css 中，但问题仍然存在。所以我猜 Chrome 一定是添加了这些行，但为什么呢？它在 IE 和 Edge 中工作正常。

编辑：我尝试在 Crome 中清除 css 缓存，但没有区别.. 编辑：我尝试将 css 重置添加到样式表，但仍然没有区别...

CSS（相当混乱，但正在进行中）：https://codeshare.io/sr0sg

Answer 1

尝试将此添加到您的 functions.php 文件中：

add_filter('show_admin_bar', '__return_false');

您在上面突出显示的 CSS 是由 WP 添加的，以便为 WordPress 管理栏制作 space。您还可以通过转到管理区域中的用户 > 您的个人资料 > "Show tool bar when editing site" 来隐藏管理栏。

Answer 2

这个问题有点老了，但是建议的解决方案太过激了。我建议维护管理栏并删除奇怪的 CSS.

这可以通过以下代码片段完成：

add_action('get_header', 'remove_admin_bar_weird_css');
function remove_admin_bar_weird_css() {
    remove_action('wp_head', '_admin_bar_bump_cb');
}

网页上的神秘边距

Mysterious margins on webpage

css

wordpress

wordpress-theming