「CSS」first-of-typeで直前の要素の直後の要素を取得するサンプル

2014年6月21日2020年10月13日

構文
直前の要素 + 対象の要素 { スタイルプロパティ }
「+」 は2つのセレクターを接続し、同じ親要素の子同士であって、1つ目の要素の直後にある2つ目の要素を選択します。
CSSコード

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

htmlコード

<ul>
  <li>A001　項目が選択されない</li>
  <li>B002 項目が選択されます。</li>
  <li>C003　項目が選択されない</li>
  <li>D004　項目が選択されない</li>
</ul>