CSS Alt Element Seçicisi

Alt element seçicileri (Child selectors), sadece belirli bir elementin alt elementlerini seçebilir.

Alt element seçimi

Herhangi bir soy elementi seçmek yerine, yalnızca belirli bir elementin alt elementlerini seçmek istiyorsanız, alt element seçicisini (Child selector) kullanın.

Örneğin, sadece h1 elementinin alt elementi olarak seçmek istiyorsanız, şu şekilde yazabilirsiniz:

h1 > strong {color:red;}

Bu kural, ilk h1 altındaki iki strong elementi kırmızıya dönüştürecektir, ancak ikinci h1'deki strong etkilenecektir:

<h1>This is <strong>very</strong> <strong>very</strong> important.</h1>
<h1>Gerçekten çok <strong>önemli</strong></em>.</h1>

Kişisel Deneyim

Gramer Açıklaması

Daha önce fark etmiş olmalısınız, çocuk seçicisi büyük bir işaret işareti (çocuk birleştiricisi) kullanır.

Çocuk birleştiricisi etrafında boşluklar olabilir, bu zorunlu değildir. Bu yüzden, aşağıdaki yazılar tümü de geçerlidir:

h1 > strong
h1> strong
h1 >strong
h1>strong

Sağdan sola doğru okunursa, h1 > strong seçici 'h1 elemanının altında bulunan tüm strong elemanlarını seçer' anlamına gelir.

Çocuk ve Çocuk Miras Seçicileri

Aşağıdaki seçiciyi görün:

table.company td > p

Üstdeki seçici, table elemanının td elemanı olarak altında bulunan tüm p elemanlarını seçer, bu table elemanı company sınıf özelliğine sahip bir table elemanından miras alır.