Pemilihan Elemen berdasarkan id Unik di CSS

Seperti yang sudah Anda ketahui, kelas dimaksudkan untuk ditetapkan pada sekelompok elemen. Selain kelas, elemen juga dapat dipilih berdasarkan id, yang merupakan pengidentifikasi unik elemen. Yang dimaksud dengan keunikan adalah jika sudah ada elemen dengan id tersebut di halaman, maka tidak boleh ada elemen lain dengan id yang sama.

Pengidentifikasi unik ditetapkan menggunakan atribut id, yang di dalamnya ditulis nama yang kita buat. Misalnya, mari kita buat dua blok. Untuk yang pertama, kita beri id dengan nilai block1, dan untuk yang kedua - dengan nilai block2:

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

Untuk menargetkan elemen dengan id tertentu, perlu ditulis simbol # dan nama yang kita buat, seperti ini:

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

Atribut id digunakan ketika perlu menekankan keunikan suatu elemen. Kelas digunakan ketika diasumsikan bahwa mungkin ada banyak elemen seperti itu, meskipun saat ini hanya ada satu.

Diberikan kode berikut:

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

Warnai konten blok elem1 menjadi merah, blok elem2 - menjadi hijau, dan blok elem3 - menjadi biru langit.