Výběr elementu podle jedinečného id v CSS

Jak již víte, třídy jsou určeny k tomu, aby byly přiřazovány skupině elementů. Kromě tříd lze také vybírat elementy podle id, které představuje jedinečný identifikátor elementu. Jedinečnost znamená, že pokud již na stránce máme element s takovým id, neměl by existovat jiný element se stejným id.

Jedinečný identifikátor se zadává pomocí atributu id, do kterého se píše vymyšlené jméno. Udělejme například dva bloky. Prvnímu nastavme id na hodnotu block1, a druhému - na hodnotu block2:

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

Chcete-li oslovit element s daným id, je třeba napsat znak # a vymyšlené jméno, takto:

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

Atribut id se používá v případě, kdy je třeba zdůraznit jedinečnost elementu. Třídy se používají tehdy, když se předpokládá, že takových elementů může být mnoho, i když je nyní pouze jeden.

Je dán následující kód:

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

Obarvěte obsah bloku elem1 na červenou, bloku elem2 - na zelenou, a bloku elem3 - na modrou.