Keuse van element volgens unieke id in CSS

Soos jy reeds weet, is klasse bedoel om aan 'n groep elemente toege ken word. Benewens klasse, kan jy ook elemente kies volgens id, wat 'n unieke identifikasie van die element verteenwoordig. Uniekheid beteken dat as ons op die bladsy reeds 'n element met so 'n id het, dan moet daar nie 'n ander element met dieselfde id wees nie.

Die unieke identifikasie word gestel met behulp van die attribuut id, waarin ons bedagte naam geskryf word. Kom ons maak byvoorbeeld twee blokke. Laat ons aan die eerste een 'n id gee met die waarde block1, en aan die tweede een - met die waarde block2:

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

Om na 'n element met die gegewe id te verwys, moet jy die simbool # en ons bedagte naam skryf, soos volg:

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

Die attribuut id word gebruik in die geval wanneer dit nodig is om die uniekheid van die element te beklemtoon. Klasse word gebruik wanneer dit veronderstel word dat daar baie sulke elemente kan wees, selfs al is daar nou net een.

Die volgende kode word gegee:

<div id="elem1">
	<h2>Titel</h2>
	<p>
		teks
	</p>
	<p>
		teks
	</p>
</div>
<div id="elem2">
	<h2>Titel</h2>
	<p>
		teks
	</p>
	<p>
		teks
	</p>
</div>
<div id="elem3">
	<h2>Titel</h2>
	<p>
		teks
	</p>
	<p>
		teks
	</p>
</div>

Kleur die inhoud van blok elem1 in rooi, blok elem2 - in groen, en blok elem3 - in blou.