Php 在我的WordPress导航菜单中插入设计元素

大家好，非常感谢所有努力帮助我的人

这是我的问题，请容忍我，因为我对这一切都比较陌生

我正在尝试在我的网站上为博客创建一个自定义的WordPress主题，这样我的博客和我的网站的外观和感觉是无缝的

现在我的问题是导航菜单。我用垂直线分隔导航链接，我一直找不到任何例子来说明如何做到这一点，或者在WordPress中找到类似的例子，如果可能的话，可以不用jQuery完成

这里是我的网站的视觉

如果有帮助，下面是菜单和css的html代码

<div id="HeaderNav">
                <ul>
                    <li class="link"><a href="/" class="nav about">about</a></li>
                    <li class="navsep">&nbsp;</li>
                    <li class="link"><a href="web.php" class="nav web">web</a></li>
                    <li class="navsep">&nbsp;</li>
                    <li class="link"><a href="photo.php" class="nav photo">photo</a></li>
                    <li class="navsep">&nbsp;</li>
                    <li class="link"><a href="#" class="nav blog">blog</a></li>
                    <li class="navsep">&nbsp;</li>
                    <li class="link"><a href="contact.php" class="nav contact">contact</a></li>
                </ul>
            </div>

如果有人能以任何方式提供帮助，我将不胜感激

---

再次感谢所有付出努力的人。

他们只是在每个菜单后创建了一个空元素：

<li class="navsep">&nbsp;</li>

---

如果你想在wordpress主题上添加垂直线来分隔导航菜单选项，你可以使用一些CSS规则。jQuery是不需要的

给你：

li.menu-item a {
    border-right: 1px solid #fff;
    padding-right: 5px;
    padding-left: 5px;
}

---

您是否已经将其添加为您的wordpress菜单，或者您也希望得到帮助。或者你只需要css修复方面的帮助吗？我只需要css方面的帮助，其余的我都可以。非常感谢你，为什么我没有想到这一点我不知道，因为这很明显。我对它做了一些修改，而不是li.menu-item a，我使用li.menu-item。再次感谢你。

#HeaderNav ul li.navsep
{
  width:1px;
  height:24px;
  margin:0 7px;
  padding:0;
  background-color:#ffffff;
}

li.menu-item a {
    border-right: 1px solid #fff;
    padding-right: 5px;
    padding-left: 5px;
}