+

+ (選択子)

[2] 隣接兄弟結合子 (adjacent sibling combinator) (+) は、 前の単純選択子列によって表される要素の直後にある弟である、 後の単純選択子列によって表される要素を表す兄弟結合子です。

仕様書

意味

[3] 隣接兄弟結合子は、前後2つの単純選択子列で表される要素が同じ親を持ち、 最初の要素の直後に2つ目の要素があることを表しています。 >>1

[4] ただし「直後」の判断に用いられるのは要素節点のみです。 テキスト節点などは無視されます。 >>1

[5] 文書木は実体参照を展開した状態で表現されるので、「同じ親」の判定は実体参照節点を無視して行われます。

構文

[6] 隣接兄弟結合子の前後には空白を挿入できます。

歴史

/ ... /

[23] CSS の初期案 (>>22) では /H1/ P や // P のような構文が提案されていました。

[25] >>24 では水準2に格下げ(?)されました。しかし >>26 の次の案では CSS2 の部分は削除されています。

[12] それから少し時代が下って STTS2 (>>11) や CSS2 (>>19) の初期案では DIV /IMG ~ UL/ のような構文が提案されていました。

+

[9] CSS2 では単純選択子列 (CSS2 でいう単純選択子) の後に隣接兄弟結合子が続き、 更に単純選択子列が続く列のことを隣接兄弟選択子 (adjacent sibling selector) と呼んでいました。

[21] 初出の >>20 では単に隣接選択子 (adjacent selector) でした。
[10] この用語は選択子3では使われていません。

選択子3

[14] 選択子3では ~ が追加されたため、 + は直接隣接結合子 (direct adjacent sibling combinator) と呼ばれるようになりました。 隣接兄弟結合子はこれらの総称でした。

[18] >>17 で名称が変更されて、隣接兄弟結合子が + の名称となりました。

XBL2

[16] XBL2 は影木との関係を規定していました。

例

[7] 選択子 h1 + em は h1 要素の直後の弟要素である em 要素を表します。間にテキストや注釈が挟まっていても構いません。