CSS TutorialLesson 31Preview gratis
CSS Pseudo-classes
Lesson ini bagian dari CSS · Semua level
Ringkasan
Pseudo-class adalah selector khusus yang memilih elemen berdasarkan status atau posisinya, ditulis dengan tanda titik dua seperti :hover atau :nth-child(). Ia memungkinkan membuat interaksi seperti efek hover, penandaan item aktif, hingga baris zebra tabel tanpa menambah class di HTML. Pseudo-class selalu diletakkan setelah selector biasa, misalnya a:hover.
Poin kunci
- Pseudo-class ditulis dengan pola selector:pseudo-class, contohnya a:hover dan li:first-child.
- :hover memilih keadaan saat kursor berada di atas elemen.
- :nth-child(n) memilih elemen berdasarkan urutannya dan mendukung pola seperti odd, even, dan 2n+1.
- :first-child, :last-child, dan :nth-of-type mempermudah penataan daftar serta tabel.
- Pseudo-class tidak menambah elemen di halaman; ia hanya menyaring seleksi.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.