CSS Asas: Memilih Elemen, ID dan Class

Dalam CSS, anda boleh memilih elemen, class, dan id untuk menggunakan gaya dan menyesuaikan elemen pada halaman web anda. Berikut ialah panduan terperinci tentang cara menggunakannya:

Memilih Elemen

Untuk memilih semua contoh elemen HTML tertentu, gunakan nama elemen sebagai pemilih. Contohnya, p pilih semua <p> tag dalam dokumen.

Memilih Class

Untuk memilih elemen dengan kelas yang sama, gunakan titik "." diikuti dengan nama kelas. Sebagai contoh, .my-class pilih semua elemen dengan kelas my-class.

Untuk memilih elemen dengan berbilang kelas, gunakan titik "." dan senaraikan nama kelas yang dipisahkan oleh ruang. Sebagai contoh, .class1.class2 memilih elemen dengan kedua-duanya class1 dan class2 kelas.

Memilih id

Untuk memilih elemen tertentu mengikut id, gunakan cincang "#" diikuti dengan elemen id. Sebagai contoh, #my-id pilih elemen dengan id my-id.

Menggabungkan Element, Class, dan ID Pilihan

Anda boleh menggabungkan pilihan elemen, class, dan id untuk menyasarkan elemen tertentu dengan kelas dan ID.

Sebagai contoh, div.my-class#my-id pilih <div> elemen dengan class my-class  dan ID my-id.

Berikut ialah contoh khusus untuk memilih elemen, class, dan id dalam CSS:

/* Select all <p> tags */  
p {  
  color: blue;  
}  
  
/* Select elements with the class "my-class" */  
.my-class {  
  background-color: yellow;  
}  
  
/* Select the element with the ID "my-id" */  
#my-id {  
  font-weight: bold;  
}  
  
/* Combine element, class, and ID selections */  
div.my-class#my-id {  
  border: 1px solid black;  
}  

Dengan menggunakan element, class, dan pilihan id, anda boleh memilih dan menggayakan elemen atau kumpulan elemen tertentu dengan mudah pada halaman web anda.