Css 伪元素仅作为同一行上元素之间的分隔符

我想为下面的问题找到一个优雅的解决方案

我有由管道分隔的链接，在响应式布局中，根据视口的宽度，它们的外观如下所示：

在大屏幕上：

link | link | link | link | link

在较小的屏幕上

link | link | link
   link | link

请注意，管道分隔符仅显示在连接之间，而不是线的起点或终点

我考虑使用一个简单的：after元素添加| with:last-child规则以避免最后一项，但在自然换行的情况下，我将以类似的方式结束：

 link | link | link |
     link | link

在纯css中有没有这样做的方法？

---

谢谢

如果您在包装链接时可以左对齐链接，您可以尝试以下方法：

nav{
溢出：隐藏；
}
保险商实验室{
填充：0；
}
李{
显示：内联块；
字号：4rem；
位置：相对位置；
填充：0 1rem；
}
李：以前{
内容：“|”；
位置：绝对位置；
左：-.5雷姆；
}

链接
链接
链接
链接
链接
链接

您可以使用@media设置特定于宽度的伪元素，但要找到确切的断点，我认为只有使用media查询时才非常麻烦。基本上，为了自动完成这项工作，您需要Javascript，因为CSS无法检测换行或换行。考虑到您似乎已在CSS中设置了一个断点来更改项目的视图，您只需在媒体查询中添加一条规则，说明您不想/确实想为元素X添加管道？2019年的解决方案可能会有所帮助：@VXp不幸的是，不是耶，我考虑了负边距和溢出隐藏技巧，不幸的是，它不适用于居中的项目。