【问题标题】:How to Center Custom Wordpress Theme Navigation bar?如何将自定义 Wordpress 主题导航栏居中?
【发布时间】:2023-03-03 01:28:02
【问题描述】:

各位程序员大家好

我想使导航居中并且已经研究并且不知道要插入到我从 HTML 转换为 Wordpress 的自定义主题中的代码。 (我对 Wordpress 主题开发有点陌生)

我的定制 wordpress 主题已经拉出 wordpress 上的任何菜单并将其插入。

但我只需要帮助使菜单居中。观察下图...菜单太靠左了。

这是我目前在网站上的“header.php”中显示 WordPress 菜单的一些相关代码。

(Header.php 文件)

<nav class="menubar"> <ul id="menu"> <?php wp_nav_menu();?> </nav>

Image of my navigation menu which appears more on the left side.

附:请帮助我简单地将我的菜单居中,非常感谢您的回复。

【问题讨论】:

  • 你用来输出菜单的东西在编写 CSS 以使其居中时几乎没有重要性。请提供minimal reproducible example 以确保重现问题。您还需要研究并至少尝试一次自己编写代码。

标签: css wordpress header nav navigationbar


【解决方案1】:

或者您也可以将导航栏包装在一个包装器 div 中,并赋予其与网站主要内容相同的宽度(这可能是也可能不是您要查找的内容)。

<div class="nav-wrapper">
<nav class="menubar">
    <ul id="menu">
    <?php wp_nav_menu();?>
    </nav></div>

.nav-wrapper{
max-width: 1170px; /* let's say this is the width of the main div */
display: block;
margin: 0 auto;
}

【讨论】:

    【解决方案2】:
    .menubar, #menu {
        width:100%;
    }
    
    #menu {
        text-alighn:center;
        padding:0;
        margin:0;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-01-29
      • 1970-01-01
      相关资源
      最近更新 更多