html - 親のli+liが子に伝わるのを防ぐ

Question

リスト項目を区切るためにナビメニューでこれを使用しています

nav li + li:before{
    content: " | ";
}

これにより、各リスト項目の間にバーが配置されますが、最初の要素の前にはバーが配置されません。そして、:before 疑似セレクターを使用すると、最後に配置されません。（ここで提案されているように、ナビゲーションのセパレーター）

ただし、これが子リスト項目に引き継がれるのを防ぎたいです。

例えばnav ul li ul li

私は試してみましcontent:none;たcontent:"";が、まだサブメニューに表示されています。

助けてください！

Answer 1

子コンビネータ ( ) を使用した、上書きしない代替>:

nav > ul > li + li:before {
    content: " | ";
}

Child Combinator は、要素が別の要素の直接の子である (その要素の孫ではない) 場合に要素を選択します。

Answer 2

ああ-私は答えを見つけました！

nav ul li li:before {
    content: "";
}