CSSда ку́рнама ва синфлар

Бизда ку́йидаги код бор деб фараз қилайлик:

<div class="block">
	<h2>Title</h2>
	<p>
		text
	</p>
</div>
<div class="block">
	<h2>Title</h2>
	<p>
		text
	</p>
</div>

Келтинг, h2 сарлавҳаларни ва block синфли элемент ичида жойлашган абзацларни танлаймиз ва уларни турли рангларга бўяймиз. Бунинг учун ку́рнама селекторидан фойдаланамиз (бу селекторлар ўртасидаги бўшлиқ):

.block h2 {
	color: red;
}
.block p {
	color: green;
}

Ку́йидаги код берилган:

<p class="eee">
	text <i>italic</i>
</p>
<p class="eee">
	text <i>italic</i>
</p>
<div class="eee">
	text <i>italic</i>
</div>
<div class="eee">
	text <i>italic</i>
</div>

eee синфли элементлар ичида жойлашган барча i тегларни қизил рангга бўянг.