Selektor Tetangga di CSS

Selektor tetangga + memungkinkan untuk memilih elemen berdasarkan tetangganya di atas.

Sintaks

selektor1 + selektor2 {
	
}

Mari kita pilih semua tag p, yang berada langsung setelah tag h2, dan warnai dengan warna merah:

<h2>text</h2>
<p>
	+
</p>
<p>
	-
</p>
<p>
	-
</p>

h2 + p {
	color: red;
}

Mari kita pilih semua tag p, yang berada langsung setelah elemen dengan kelas .test, dan warnai dengan warna merah:

<p class="test">
	text
</p>
<p>
	+
</p>
<p>
	-
</p>

.test + p {
	color: red;
}

Mari kita pilih semua elemen dengan kelas .elem, yang berada langsung setelah elemen dengan kelas .test, dan warnai dengan warna merah:

<p class="test">
	text
</p>
<p class="elem">
	+
</p>
<p>
	-
</p>

.test + .elem {
	color: red;
}

Selektor Anak,
yang memungkinkan memilih elemen berdasarkan penurunan langsung
Selektor Kontekstual,
yang memungkinkan memilih elemen berdasarkan induknya
Selektor Saudara Umum,
yang memungkinkan memilih elemen setelah elemen yang ditentukan
Selektor Universal,
yang memungkinkan memilih semua elemen