[解決済み] CSS :not(:last-child):after セレクタ

質問

私は、このようなスタイルの要素のリストを持っています。

ul {
    list-style-type: none;
    text-align: center;
}

li {
    display: inline;
}

li:not(:last-child):after {
    content:' |';
}

<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
</ul>

出力内容 One | Two | Three | Four | Five | の代わりに One | Two | Three | Four | Five

最後の要素以外をCSSで選択する方法をご存知の方はいらっしゃいますか？

の定義を見ることができます。 :not() セレクター ここで

解決方法は？

not selectorの問題であれば、全て設定し、最後の1つをオーバーライドすることができます

li:after
{
  content: ' |';
}
li:last-child:after
{
  content: '';
}

または、beforeが使えるならlast-childは不要です。

li+li:before
{
  content: '| ';
}