Kelas vs ID
Cascading Style Sheets (CSS) adalah bahasa yang mendeskripsikan tampilan dan pemformatan dokumen yang ditulis menggunakan bahasa markup. CSS banyak digunakan untuk menata halaman web yang ditulis dalam HTML. CSS memungkinkan menentukan pemilih gaya Anda sendiri selain menerapkan gaya untuk elemen HTML. Ini dilakukan dengan menggunakan ID dan pemilih kelas. Saat menentukan gaya untuk satu elemen unik, pemilih ID digunakan. Saat menentukan gaya untuk sekelompok elemen, pemilih kelas digunakan.
Apa itu Kelas?
Di CSS, pemilih Kelas dapat digunakan untuk menerapkan gaya Anda sendiri ke sekelompok elemen. Selektor kelas digunakan untuk menerapkan gaya tertentu ke sekumpulan elemen dengan kelas yang sama. Dalam CSS, pemilih kelas diidentifikasi dengan tanda titik (.). Berikut adalah contoh pemilih kelas yang ditentukan dalam CSS.
.kelasku {
warna biru;
font-weight: bold;
}
HTML dapat merujuk ke kelas yang ditentukan dalam CSS dengan menggunakan kelas atribut seperti yang ditunjukkan di bawah ini.
Ini adalah pemformatan saya
Ini adalah pemformatan saya lagi
Seperti yang ditunjukkan di atas, kelas yang sama dapat digunakan untuk banyak elemen dan satu elemen dapat menggunakan banyak kelas. Ketika beberapa kelas digunakan dalam elemen yang sama, kelas-kelas tersebut dimasukkan ke dalam atribut kelas yang dipisahkan oleh spasi seperti yang ditunjukkan di bawah ini.
Ini adalah pemformatan saya menggunakan dua kelas
Apa itu ID?
Di CSS, pemilih ID dapat digunakan untuk menerapkan gaya Anda sendiri ke satu elemen unik. Di CSS, pemilih ID diidentifikasi dengan hash (#). Berikut adalah contoh pemilih ID yang ditentukan di CSS.
#my_ID {
warna merah;
text-align: right;
}
HTML dapat mengacu pada pemilih ID yang ditentukan dalam CSS dengan menggunakan id atribut seperti yang ditunjukkan di bawah ini.
Ini adalah pemformatan saya dari pemilih ID
ID unik. Oleh karena itu, setiap elemen hanya dapat memiliki satu ID dan setiap halaman hanya dapat memiliki satu elemen dengan ID spesifik tersebut. ID memiliki karakteristik penting yang dapat digunakan dengan browser. Jika URL halaman berisi nilai hash (mis. Http: //myweb.com#my_id) browser akan mencoba menemukan elemen secara otomatis dengan ID "my_id" dan menggulir halaman web untuk menampilkan elemen itu. Inilah salah satu alasan mengapa halaman harus memiliki satu elemen dengan ID spesifik tersebut, sehingga browser dapat menemukan elemen tersebut.
Apa perbedaan antara Class dan ID?
Meskipun pemilih Kelas dan pemilih ID dapat digunakan untuk menerapkan gaya Anda sendiri ke elemen di halaman web, keduanya memiliki beberapa perbedaan penting. Selektor kelas dapat digunakan untuk menerapkan gaya Anda sendiri ke sekelompok elemen, sedangkan pemilih ID digunakan untuk menerapkan gaya ke satu elemen unik. Saat menggunakan ID, setiap elemen hanya dapat memiliki ID tunggal dan setiap halaman hanya dapat memiliki satu elemen dengan ID spesifik tersebut, tetapi Kelas dapat digunakan untuk beberapa elemen dan satu elemen dapat menggunakan beberapa Kelas. Selain itu, ID dapat digunakan untuk menggulir halaman secara otomatis untuk menampilkan elemen dengan ID tersebut, tetapi ini tidak dapat dilakukan dengan pemilih kelas.
