This translation is incomplete. Please help translate this article from English.

The :first-of-type CSS pseudo-class represents the first element of its type among a group of sibling elements.

/* Selects the first <p> to appear inside a parent element
   regardless of its position inside the siblings */
p:first-of-type {
  color: red;
}

Not: Orijinal tanımında seçili elemanın bir üst seçicisi (parent) olması gerekliliği vardı. Seçiciler Seviye 4'ten itibaren artık gerekmiyor.

Sözdizimi

:first-of-type

Örnekler

Örnek 1: Temel ilk paragraf

Aşağıdaki HTML'i baz alalım:

<h2>Başlık</h2>

<p>Paragraf</p>

<p>Paragraf</p>

Ve CSS:

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

Bu bize aşağıdaki sonucu verecek — sadece body içerisinde görünecek ilk paragraf elemanı olarak görünecek ilk paragrafın rengini kırmızı yapar:

Örnek 2: Evrensel seçici olarak..

This example shows how the universal selector is assumed when no simple selector is written.

Önce biraz HTML:

<div>
  <span>Bu ilk `span`!</span>
  <span>Ama bu `span` değil.</span>
  <span>Bu <em>element içinde `em`</em>!</span>
  <span>Ve bu da <span>element içinde `span`</span>!</span>
  <b>Bu `b` niteliği!</b>
  <span>This final `span` does not.</span>
</div>

Şimdi de CSS:

div :first-of-type {
  background-color: lime;
}

Sonuç şöyle görünecek:

Özellikler

Specification Status Comment
Selectors Level 4
The definition of ':first-of-type' in that specification.
Working Draft Matching elements are not required to have a parent.
Selectors Level 3
The definition of ':first-of-type' in that specification.
Recommendation Initial definition.

Tarayıcı uyumluluğu

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Özellik Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Temel destek 1.0 (Yes) 3.5 (1.9.1) 9.0 9.5 3.2
Özellik Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Temel destek 2.1 (Yes) 1.0 (1.9.1) 9.0 10.0 3.2

Şunlar da var

Document Tags and Contributors

Contributors to this page: ceylanabdullah
Last updated by: ceylanabdullah,