組み合わせた第一子、私は私のメニュー項目間のセパレータを追加するには、次のコードを使用しています：CSS：前：
#navigation_center li:before {
content: "| ";
color: #fff;
}
は今、私はそれの前に区切りを持っていない最初のアイテムが欲しいです、私は次のコードを見つけました：
#navigation_center li:before:first-child {
content: none;
}
しかし、それは何もしていません。 beforeと：first-childを組み合わせることは可能ですか？
は編集
#navigation_center li:first-child:before {
content: '';
}
をお試しください：私はFelipeAlsによって行われたコメントを、この答えに拡大したかったです。元の質問は有効なCSSセレクタではない:firstを使用しました。代わりに、:first-childを使用してください。擬似セレクタの順序も重要です。最初の子セレクタが最初に来なければなりません。
私は:beforeをセレクタの一種の修飾語と考える傾向があります。選択された要素の直前の領域だけを実際に選択するわけではありません。
hradacの回答は、新人を助けるためにいくつかの可能な並べ替えを実行するのが最善だろうと思っています。
.works:first-child:before
{
\t color: green;
\t content: 'working ';
}
.works:not(:first-child):after
{
\t color: green;
\t content: ' is working';
}
.broken:before:first-child
{
\t color: red;
\t content: 'this will never show up';
}
.broken:after:not(:first-child)
{
\t color: red;
\t content: 'and this will not show up either';
}works:
<div>
\t <div class='works'>
\t something
\t </div>
\t <div class='works'>
\t something
\t </div>
\t <div class='works'>
\t something
\t </div>
</div>
<hr/>
broken:
<div>
\t <div class='broken'>
\t something
\t </div>
\t <div class='broken'>
\t something
\t </div>
\t <div class='broken'>
\t something
\t </div>
</div>のは、これを離れてみましょう：
div.worksがdiv.brokenはdiv要素first-childを選択し、その直前の空きスペースを選択することによって行われます。first-child定義に該当しない各ブロックを選択してから、その前の空きスペースを選択します。:before:first-childは空白を選択しようとしますが、それがfirst-childであるかどうかをテストします。技術的にはまだDOMツリーには入っていないので、同様の問題は:not(:first-child)です。
hradac答えのクイック説明： '：first'は、jQueryのセレクタである（とjQueryが完全であることを、シズルを使用しています）CSSを使用しています'：最初-child' – FelipeAls
@FelipeAlsacreations私の答えに拡大してくれてありがとう。私は確信が持てませんが、「初子」が「前」の前に来るような順序も重要だと思いますが、私はこれをテストしていません。 – hradac
@hradacあなたが正しいです、注文があります。私が '：before'と'：after'を最後に書いておかなければならない限り、私は正しいと思います。 CSS3セレクタモジュールで確認：[セレクタごとに擬似要素が1つしか表示されず、存在する場合はシンプルセレクタ（...）のシーケンスの後に表示される]（http://www.w3.org/TR/selectors/ ＃pseudo-elements） – FelipeAls