web-dev-qa-db-ja.com

1つのタグの直後に別のタグが続くセレクター

これにより、すべての<B>タグが直接選択されます by <A>タグ:

A+B {
    /* styling */
}

すべての<A>タグの直接セレクターは何ですか by <B>タグ?

ここに私の質問に合ったサンプルHTMLがあります:

<a>some text</a>
<b>some text</b>
77

CSSではできません。

編集:もう少し役立つように、たとえばjQuery(JavaScriptライブラリ)を使用する場合、 .prev()

26
jeroen

Aのスタイルは、Bエレメントが直接内部にあるか従っているという意味ですか?このような:

<A>
    <B>
    </B>
</A>

// OR

<A>
</A>
<B>
</B>

CSSではそのようなことはできません(まだ)。エリック・マイヤーは、この種のセレクターはCSSメーリングリストで何度も議論されてきたが、実行できないと述べています。 WebKitの中核開発者の1人であるデイブ・ハイアットは、なぜそれができないのかを説明しています。

チェックアウト: Shaun Inmanのブログ投稿 および Eric Meyerによるコメント
デビッド・ハイアットが計量

52
Nick Presta

逆の操作のみ実行できます。これにより、タグの直前にあるすべてのタグが選択されます。

これは論理的にリクエストと同等です。

多くの場合、これを使用して多くのチェックボックスの列にラベルを付けます

CSS:

label+input {
    margin-left: 4px;
}

DOM:

<input id="a" name="a" type="checkbox"/><label for="a">...</label>
<input id="b" name="b" type="checkbox"/><label for="b">...</label>
<input id="c" name="c" type="checkbox"/><label for="c">...</label>
12
Marco Marsala