Perbezaan antara pemilih id CSS dan pemilih kelas

Bahagian sebelumnya memperkenalkan beberapa pemilih asas Bahagian ini berkongsi perbezaan antara id dan kelas

Atribut id dan kelas ialah dua atribut biasa dalam halaman web . Apabila kita menentukan gaya untuk elemen. Anda boleh menggunakan id atau kelas. Tetapi kita juga harus memberi perhatian kepada perbezaan antara keduanya.

1. Apabila menulis dalam helaian gaya CSS, simbol awalan ‘#’ hendaklah ditambah di hadapan pemilih id, dan simbol awalan ‘.’ hendaklah ditambah di hadapan pemilih kelas.

2. Atribut id biasanya hanya boleh digunakan sekali dalam halaman, manakala kelas boleh dirujuk beberapa kali.

3. ID digunakan sebagai teg bagi elemen untuk membezakan struktur dan kandungan yang berbeza, manakala kelas ialah gaya yang boleh digunakan pada mana-mana struktur dan kandungan.

4 Dari segi idea reka letak, prinsip ini secara amnya dipatuhi: id menentukan struktur dan kandungan halaman terlebih dahulu, dan kemudian mentakrifkan gaya untuknya: sebaliknya, kelas mentakrifkan jenis gaya pertama, dan kemudian Gunakan gaya kelas pada elemen dan kandungan yang berbeza pada halaman mengikut keperluan.

5 Pada masa ini, penyemak imbas membenarkan berbilang ID dengan nilai atribut yang sama muncul pada halaman yang sama, ia boleh dipaparkan secara normal, namun, apabila menggunakan JavaScript untuk mengawal elemen melalui ID, ralat akan berlaku .

6. Dalam aplikasi sebenar, kelas lebih kerap digunakan dalam bahagian teks dan pengubahsuaian halaman, manakala id lebih kerap digunakan untuk melaksanakan reka letak besar dan reka bentuk yang mengandungi blok atau gaya kotak yang mengandungi.

Nota:

ID mempunyai ciri-ciri keutamaan dan keunikan yang tinggi "individu".
Berbanding dengan ID, keutamaan kelas adalah agak sederhana, khususnya merujuk kepada "kumpulan khusus".
Penggunaan Kelas memerlukan merujuk kepada konsep abstrak berorientasikan objek dan mengabstrakkan atribut biasa.

ID ialah untuk mencari struktur/kandungan dahulu, dan kemudian tentukan gaya untuknya
Kelas adalah untuk mentakrifkan gaya dahulu, dan kemudian menggunakannya pada berbilang struktur/kandungan .

bahagian seterusnya

fail baharu

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>id和class</title> 
<style>
 /*id选择器*/
	#rrrrr 
	{
	background-color: red;
	}
	/*类选择器*/
	.important 
	{
	color: aqua;
	font-size:smaller;
	}
	/*类选择器*/
	.important2222
	{
	font-size:larger;
	background-color:black;
	}
</style>
</head>
<body>
 <!--可以同时使用多个类-->
 <div class="important important2222"> 
 1、人生最精彩的不是成功的那一瞬间，而是回头看，那段漆黑看似没有尽头、苦苦摸索的过程。其实，我只是很在意，在意在我所在意的人的心里，我，在哪个位置。
 </div>
 <h1>
 1、人生最精彩的不是成功的那一瞬间，而是<span>3333333333</span>
 </h1>

 <p>
 2、生活再不如人意，都要学会自我温暖和慰藉，<br />
 给自己多一点欣赏和鼓励。生活就是童话，<br />
 只要心存美好，结局就会是美好。<br />
 </p>
 <p id="rrrrr">
 3、旁观者的姓名永远爬不到比赛的计分板上。
 </p>
 <p>
 4、强烈的信仰会赢取坚强的人，然后又使他们更坚强。
 </p>
 <p>
 5、只要我们能梦想的，我们就能实现。
 </p>
 <p>
 6、每一个成功者都有一个开始。勇于开始，才能找到成功的路。
 </p>
 </body>
</html>

serahkan Tetapkan Semula Kod

Operasi automatik

Skrin penuh