Elementa atlase pēc unikāla id CSS

Kā jūs jau zināt, klases ir paredzētas, lai piešķirtu tās elementu grupai. Papildus klasēm, var arī atlasīt elementus pēc id, kas ir elementa unikāls identifikators. Unikalitāte nozīmē, ka, ja mūsu lapā jau ir elements ar šādu id, tad cita elementa ar tādu pašu id nedrīkst būt.

Unikāls identifikators tiek iestatīts, izmantojot atribūtu id, kurā raksta mūsu izdomātu vārdu. Pieņemsim, piemēram, izveidosim divus blokus. Pirmajam iestatīsim id ar vērtību block1, bet otram - ar vērtību block2:

<div id="block1">
	<p>text</p>
	<p>text</p>
</div>
<div id="block2">
	<p>text</p>
	<p>text</p>
</div>

Lai piekļūtu elementam ar noteiktu id, jāraksta simbols # un mūsu izdomātais vārds, šādi:

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

Atribūts id tiek izmantots gadījumā, kad nepieciešams uzsvērt elementa unikalitāti. Klases tiek izmantotas tad, kad paredzams, ka šādu elementu var būt daudz, pat ja šobrīd tas ir tikai viens.

Dots šāds kods:

<div id="elem1">
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div id="elem2">
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div id="elem3">
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

Izkrāsojiet bloka elem1 saturu sarkanā krāsā, bloka elem2 - zaļā, un bloka elem3 - gaiši zilā.