CSS'те уникалдуу id аркылуу элементти тандоо

Сиздер мурунтан эле билесиздер, класстар элементтердин тобуна берилүүгө арналган. Класстардан тышкары, элементтерди уникалдуу идентификатор болгон id аркылуу тандап алууга да болот. Уникалдуулук деп, эгерде баракта мындай id бар элемент бар болсо, анда ошол эле id менен башка элемент болбошу керек дегенди түшүнөбүз.

Уникалдуу идентификатор id атрибуту аркылуу белгиленет, анын ичинде биз ойлоп тапкан ат жазылат. Келгиле, мисалы, эки блок жасайлы. Биринчисине id маанисинде block1, экинчисине - block2 деп белгилейли:

<div id="block1">
	<p>текст</p>
	<p>текст</p>
</div>
<div id="block2">
	<p>текст</p>
	<p>текст</p>
</div>

Белгиленген id менен элементе кайрылуу үчүн, # символун жана ойлоп тапкан атыбызды мындайча жазышыбыз керек:

#block1 {
	color: red;
}
#block2 {
	color: green;
}

id атрибуту элементтин уникалдуулугун баса белгилөө зарыл болгон учурда колдонулат. Класстар, ал эми мындай элементтер көп болушу мүмкүн болгон учурда, азыр бир гана болсо да, колдонулат.

Төмөнкү код берилген:

<div id="elem1">
	<h2>Title</h2>
	<p>
		текст
	</p>
	<p>
		текст
	</p>
</div>
<div id="elem2">
	<h2>Title</h2>
	<p>
		текст
	</p>
	<p>
		текст
	</p>
</div>
<div id="elem3">
	<h2>Title</h2>
	<p>
		текст
	</p>
	<p>
		текст
	</p>
</div>

elem1 блогунун мазмунун кызыл түскө, elem2 блогун жашыл түскө, ал эми elem3 блогунун мазмунун көгүш түскө боёңуз.