使列表跳过图像

Question

我有以下的设计

the Story of Us，The Style，Journal，Locate Us，the Contact，这是所有将是WordPress的仪表板>菜单管理，因此这将是动态的。现在，如何使该菜单跳过图像（L.tru logo）并继续直到最后一个菜单项，所以图像将保持在导航菜单的中心？

Answer 1

在不知道确切的代码 - let's假设菜单的结构如下：

<ul class="menu"> 
<li>item</li> 
<li>item</li> 
<li>item</li> 
<li>item</li> 
</ul> 

我们知道，标志第二个菜单项后出现。因此，我们可以使用以下命令：

ul.menu li:nth-child(2) { margin-right: Xpx } 

凡Xpx必须标识的适当宽度，再加上你想要的菜单项目和标志之间有利润。

但是，由于这可能会动态更改 - 您可能需要每次更改菜单时都更改此菜单，因为菜单项长度会发生变化。

更好的做法是实际制作两个WordPress菜单：一个位于徽标左侧，右侧。那么你可以更确定的定位。

理论上可行的第三种更先进的方法是使用SASS和CSS计算更加动态地计算适当的边界。