如何隐藏最后| 用CSS？

Question

我有一个ul li像这样的 HTML：

<ul id="menu-footer-menu" class="menu">
   <li id="menu-item-356" class="menu-item menu-item-type-taxonomy menu-item-356">
      <a href="http://example.com/link1/">Title 1</a>
      <span class="f_sep">|</span>
   </li>
   <li id="menu-item-357" class="menu-item menu-item-type-taxonomy menu-item-357">
      <a href="http://example.com/link2/">Title 2</a>
      <span class="f_sep">|</span>
   </li>
   <li id="menu-item-358" class="menu-item menu-item-type-taxonomy menu-item-358">
      <a href="http://example.com/link3/">Title 3</a>
      <span class="f_sep">|</span>
   </li>
</ul>

哪个输出像这样

Title 1 | Title 2 | Title 3 | 

所以通过CSS我想最后隐藏|。我尝试过这个，但它隐藏了所有|

#menu-footer-menu .f_sep:last-child{display:none}

我想要这样的最终输出

Title 1 | Title 2 | Title 3  

请注意：我的问题与这个问题无关，因为它是通过添加的|，但|我的 HTML 中已经有管道，所以我只想隐藏最后一次出现的情况。

Answer 1

你做错了。这是正确的答案：

#menu-footer-menu li:last-child .f_sep{ display:none }