Pemilihan Pencabut id CSS

Pemilih id

Pemilih id dapat menentukan gaya khusus bagi elemen HTML yang diidentifikasi dengan id tertentu.

Pemilih id didefinisikan dengan "#".

Dalam dua pemilih id di bawah, yang pertama dapat menentukan warna elemen menjadi merah, dan yang kedua menentukan warna elemen menjadi hijau：

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

Dalam kode HTML di bawah, elemen p yang properti id-nya adalah red ditampilkan dengan warna merah, sementara elemen p yang properti id-nya adalah green ditampilkan dengan warna hijau。

<p id="red"> Paragraf ini adalah merah。</p>
<p id="green"> Paragraf ini adalah hijau。</p>

Perhatian:Properti id hanya boleh muncul sekali dalam setiap dokumen HTML. Mengapa? silakan lihat XHTML: pembaruan laman.

Pemilih id dan pemilih turun

Dalam perekaan modern, pemilih id sering digunakan untuk membangun pemilih turun.

#sidebar p {
	font-style: italic;
	text-align: right;
	margin-top: 0.5em;
	}

gaya di atas hanya akan diterapkan untuk paragraf yang muncul di dalam elemen yang id-nya adalah sidebar. Elemen ini mungkin div atau sel tabel, walaupun ini juga boleh menjadi tabel atau elemen blok lain. Ia bahkan boleh menjadi elemen dalam lihat, seperti <em></em> atau <span></span>, namun penggunaan seperti ini adalah ilegal, kerana <p> tidak boleh disisipkan dalam elemen dalam <span> (jika anda lupa alasan, silakan lihat XHTML: pembaruan laman）。

Pemilih satu, berbagai penggunaan

Walaupun elemen yang dijelaskan sebagai sidebar hanya boleh muncul sekali dalam dokumen, pemilih id ini sebagai pemilih turun pula boleh digunakan berbanyak kali:

#sidebar p {
	font-style: italic;
	text-align: right;
	margin-top: 0.5em;
	}
#sidebar h2 {
	font-size: 1em;
	font-weight: normal;
	font-style: italic;
	margin: 0;
	line-height: 1.5;
	text-align: right;
	}

Di sini, elemen p di dalam sidebar yang jelas berbeda dengan elemen p lain di halaman, elemen p di dalam sidebar mendapatkan pengolahan khusus, serta elemen h2 di dalam sidebar yang jelas berbeda dengan semua elemen h2 lain di halaman, elemen h2 di dalam sidebar juga mendapatkan pengolahan khusus yang berbeda.

Pemilihan pencabut sendiri

Pemilihan pencabut id bahkan jika tidak digunakan untuk menciptakan pemilihan pencabut derivatif, masih dapat berfungsi secara mandiri:

#sidebar {
	border: 1px dotted #000;
	padding: 10px;
	}

Menurut aturan ini, elemen dengan id sidebar akan memiliki batas garis titik hitam lebar satu piksel, serta akan memiliki internal padding (padding, ruang internal) lebar sepuluh piksel. Peramban Windows/IE versi lama mungkin mengabaikan aturan ini kecuali Anda menentukan khusus elemen pemilihan pencabut ini:

div#sidebar {
	border: 1px dotted #000;
	padding: 10px;
	}

Kandungan yang Berhubungan

Jika Anda memerlukan pemahaman yang mendalam tentang pemilihan pencabut id, silakan baca panduan tingkat tinggi CodeW3C.com:Pemilihan Pencabut id Dengan Lengkap CSS.