CSS'de Bitişik Seçici
Bitişik seçici +, bir öğeyi
hemen üstündeki komşusuna göre seçmeye izin verir.
Sözdizimi
seçici1 + seçici2 {
}
Örnek
h2 etiketlerinin hemen ardından gelen
tüm p etiketlerine ulaşalım
ve onları kırmızı renge boyayalım:
<h2>text</h2>
<p>
+
</p>
<p>
-
</p>
<p>
-
</p>
h2 + p {
color: red;
}
:
Örnek
.test sınıfına sahip öğelerin
hemen ardından gelen tüm p
etiketlerine ulaşalım ve onları kırmızı
renge boyayalım:
<p class="test">
text
</p>
<p>
+
</p>
<p>
-
</p>
.test + p {
color: red;
}
:
Örnek
.test sınıfına sahip öğelerin
hemen ardından gelen, .elem
sınıfına sahip tüm öğelere ulaşalım
ve onları kırmızı renge boyayalım:
<p class="test">
text
</p>
<p class="elem">
+
</p>
<p>
-
</p>
.test + .elem {
color: red;
}
:
Ayrıca Bakınız
-
Alt Seçici,
öğeleri doğrudan iç içe geçmişliğe göre seçmeye izin verir -
Bağlamsal Seçici,
bir öğeyi ebeveynine göre seçmeye izin verir -
Genel Kardeş Seçici,
belirli bir öğeden sonra gelen öğeleri seçmeye izin verir -
Evrensel Seçici,
tüm öğeleri seçmeye izin verir