Perbezaan Antara id dan kelas dalam CSS

Isi kandungan:

Apakah Peraturan CSS
Apa itu id
Apa itu kelas
Perbezaan Antara id dan kelas dalam CSS

The perbezaan utama antara id dan kelas dalam CSS adalah bahawa id digunakan untuk menerapkan gaya pada satu elemen yang unik sementara kelas digunakan untuk menerapkan gaya pada beberapa elemen.

Terdapat pelbagai teknologi dalam pembangunan web. Bahasa utama untuk membangunkan laman web adalah HTML, CSS dan JavaScript. HTML bermaksud Hyper Text Markup Language. Ia membantu mengembangkan struktur laman web. JavaScript membantu menjadikan laman web lebih dinamik. CSS bermaksud Cascading Style Sheets. Ini membantu menambah gaya dan menjadikan laman web lebih rapi. Peraturan CSS berlaku untuk elemen HTML. Juga, pemilih CSS membantu mencari elemen dan menerapkan gaya yang diperlukan pada tag HTML. id dan kelas adalah dua jenis pemilih.

Kelas, Peraturan CSS, ID

Apakah Peraturan CSS

CSS terdiri daripada sekumpulan peraturan. Penyemak imbas boleh mentafsirkan peraturan ini dan menerapkannya pada elemen yang ditentukan dalam dokumen. Peraturan gaya CSS terdiri daripada tiga bahagian. Mereka adalah pemilih, harta dan nilai. Deklarasi merujuk kepada gabungan harta dan nilai. Mereka muncul di dalam sepasang pendakap kerinting seperti berikut.

pemilih {sifat: nilai; }

Pemilih - Membantu mengenal pasti elemen untuk menerapkan gaya

Harta tanah - Atribut. Semua atribut HTML diubah menjadi sifat CSS. Beberapa contoh adalah warna, penjajaran teks, sempadan, dll.

Nilai - Nilai adalah apa yang diberikan kepada harta tanah. Contohnya, warna biru boleh diberikan pada warna harta tanah.

Apa itu id

Pengaturcara dapat menentukan peraturan gaya berdasarkan id elemen. Semua elemen dengan id yang sama akan diterapkan dengan gaya yang ditentukan. Untuk memilih elemen dengan id tertentu, harus ada simbol # (hash) diikuti oleh id elemen.

Anggap bahawa fail HTML mengandungi pernyataan seperti berikut.

Fail CSS mengandungi sekeping kod berikut.

# pengepala1 {

warna: biru;

}

Apabila penyemak imbas menafsirkan pernyataan HTML, ia memeriksa id elemen h1, yang merupakan header1 dalam fail CSS. Kemudian, ia menerapkan peraturan CSS yang ditentukan pada elemen h1. Oleh itu, teks Hello World akan muncul dengan warna biru.

Id unik dalam halaman. Oleh itu, pemilih id digunakan untuk satu elemen unik.

Apa itu kelas

Sama dengan id, pengaturcara dapat menentukan peraturan gaya berdasarkan kelas elemen. Semua elemen dengan kelas yang sama akan diterapkan dengan gaya yang ditentukan. Untuk memilih elemen dengan kelas tertentu, harus ada. (noktah) simbol diikuti dengan nama kelas.

Andaikan bahawa fail HTML mengandungi pernyataan berikut.

Fail CSS mengandungi sekeping kod berikut.

.pemimpin1 {

warna: biru;

}

Apabila penyemak imbas menafsirkan pernyataan HTML, ia memeriksa kelas elemen h1, yang merupakan header1 dalam fail CSS. Kemudian, ia menerapkan peraturan CSS yang ditentukan untuk semua elemen h1. Oleh itu, teks Hello World 1 dan Hello World 2 akan muncul dengan warna biru.

Adalah mungkin untuk menggunakan kelas yang sama pada pelbagai elemen. Oleh itu, pemilih kelas digunakan untuk pelbagai elemen.

Perbezaan Antara id dan kelas dalam CSS

Definisi

id adalah pemilih dalam CSS yang menggayakan elemen dengan id yang ditentukan sedangkan kelas adalah pemilih dalam CSS yang menggayakan elemen yang dipilih dengan kelas yang ditentukan.

Sintaks

Sintaks id adalah pernyataan #id {css; }. Sintaks kelas ialah.class {css deklarasi; }

Penggunaan

Selanjutnya, penggunaan id adalah menerapkan gaya pada satu elemen tertentu. Penggunaan kelas adalah untuk menerapkan gaya pada pelbagai elemen.

Kesimpulannya

Id dan kelas adalah dua pemilih dalam CSS yang membolehkan menerapkan gaya ke elemen HTML. Perbezaan utama antara id dan kelas dalam CSS adalah bahawa id digunakan untuk menerapkan gaya ke satu elemen unik sementara kelas digunakan untuk menerapkan gaya ke beberapa elemen.