隣接兄弟結合子

隣接兄弟結合子 (adjacent sibling combinator) (+) は2つのセレクターを接続し、同じ親要素の子同士であって、1つ目の要素の直後にある2つ目の要素を選択します。

/* 画像の直後に来る段落 */
img + p {
  font-style: bold;
}

構文

直前の要素 + 対象の要素 { スタイルプロパティ }

例

CSS

li:first-of-type + li {
  color: red;
}

HTML

<ul>
  <li>One</li>
  <li>Two!</li>
  <li>Three</li>
</ul>

Result

仕様書

ブラウザーの対応

関連情報

• 一般兄弟結合子