擬似クラス first-of-type

擬似クラス first-of-type は、 親要素内の指定された型の最初の子要素である 要素を選択します。つまり、 h2:first-of-type と書けば、 親要素内の最初の h2 が見つかります (親要素内の最初の子要素である h2 だけを見つける first-child とは異なります)。

構文

cssセレクター:first-of-type {
  
}

例

親要素内で最初の段落である 段落を見つけましょう：

html<div>
  <h2>見出し</h2>
  <p>段落</p>
  
  <h2>見出し</h2>
  <p>段落</p>
  
  <h2>見出し</h2>
  <p>段落</p>
</div>

cssp:first-of-type {
  color: red;
}

Результат: