CSS-de dogan saýlaýjy

Dogan saýlaýjy ~, berlen elementden soň, şol bir ata içinde ýerleşýän ähli elementleri saýlamaga mümkinçilik berýär.

Sintaksis

saýlaýjy1 ~ saýlaýjy2 {
	
}

Geliň, h2 teglerinden soň ýerleşýän ähli p teglere ýüzlenip, olary gyzyl reňkde boýaýalyň:

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

h2 ~ p {
	color: red;
}

Geliň, .test klassly elementlerden soň ýerleşýän ähli p teglere ýüzlenip, olary gyzyl reňkde boýaýalyň:

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

.test ~ p {
	color: red;
}

Geliň, .test klassly elementlerden soň ýerleşýän ähli .elem klassly elementlere ýüzlenip, olary gyzyl reňkde boýaýalyň:

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

.test ~ .elem {
	color: red;
}

Çaga saýlaýjy,
gönüden-göni baglylyk boýunça elementleri saýlamaga mümkinçilik berýär
Kontekst saýlaýjysy,
elementi onuň atasy boýunça saýlamaga mümkinçilik berýär
Goňşy saýlaýjy,
elementi onuň goňşysy boýunça saýlamaga mümkinçilik berýär
Uniwersal saýlaýjy,
ähli elementleri saýlamaga mümkinçilik berýär