მიმდებარე სელექტორი CSS-ში

მიმდებარე სელექტორმა + საშუალებას გაძლევთ აირჩიოთ ელემენტი მისი ზემოთ მდებარე მეზობლის მიხედვით.

სინტაქსი

სელექტორი1 + სელექტორი2 {
	
}

მოდით მივმართოთ ყველა p თეგს, რომელიც პირდაპირ მოდის h2 თეგების შემდეგ, და გავაფერადოთ ისინი წითლად:

<h2>ტექსტი</h2>
<p>
	+
</p>
<p>
	-
</p>
<p>
	-
</p>

h2 + p {
	color: red;
}

მოდით მივმართოთ ყველა p თეგს, რომელიც პირდაპირ მოდის .test კლასის მქონე ელემენტების შემდეგ, და გავაფერადოთ ისინი წითლად:

<p class="test">
	ტექსტი
</p>
<p>
	+
</p>
<p>
	-
</p>

.test + p {
	color: red;
}

მოდით მივმართოთ ყველა .elem კლასის მქონე ელემენტს, რომელიც პირდაპირ მოდის .test კლასის მქონე ელემენტების შემდეგ, და გავაფერადოთ ისინი წითლად:

<p class="test">
	ტექსტი
</p>
<p class="elem">
	+
</p>
<p>
	-
</p>

.test + .elem {
	color: red;
}

შვილი სელექტორი,
რომელიც საშუალებას გაძლევთ აირჩიოთ ელემენტები პირდაპირი ჩასმის მიხედვით
კონტექსტური სელექტორი,
რომელიც საშუალებას გაძლევთ აირჩიოთ ელემენტი მისი მშობელის მიხედვით
ნათესავი სელექტორი,
რომელიც საშუალებას გაძლევთ აირჩიოთ ელემენტები მოცემულის შემდეგ
უნივერსალური სელექტორი,
რომელიც საშუალებას გაძლევთ აირჩიოთ ყველა ელემენტი