CSS-də qohum selektor

Qohum selektor ~ eyni valideyn daxilində müəyyən edilmiş elementdən sonra yerləşən bütün elementləri seçməyə imkan verir.

Sintaksis

selektor1 ~ selektor2 {
	
}

Gəlin h2 teqlərindən sonra yerləşən bütün p teqlərinə müraciət edək və onları qırmızı rəngə boyayaq:

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

h2 ~ p {
	color: red;
}

Gəlin .test sinfi olan elementlərdən sonra yerləşən bütün p teqlərinə müraciət edək və onları qırmızı rəngə boyayaq:

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

.test ~ p {
	color: red;
}

Gəlin .test sinfi olan elementlərdən sonra yerləşən .elem sinfi olan bütün elementlərə müraciət edək və onları qırmızı rəngə boyayaq:

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

.test ~ .elem {
	color: red;
}