Pseudo Class dan Element CSS – Hai teman – teman, bertemu lagi dengan kami. Bagaimana kabar kalian hari ini? kami harap teman – teman selalu dalam keadaan dan kondisi yang sehat. Pada artikel kali ini kita akan membahas mengenai sesuatu yang berkaitan dengan bahasa pemrograman khususnya bahasa pemrograman CSS, yaitu pseudo class dan pseudo element css. Nantinya yang akan kita bahas adalah mengenai pengertian keduanya.
Pengertian Pseudo Class
Pseudo Class Selector adalah selector CSS yang digunakan untuk mengakses bagian tertentu dari HTML yang tidak tertulis di dalam HTML atau bisa dibilang bagian dari HTML yang tidak bisa diakses oleh selector sederhana lain. Penggunaan pseudo class selector sebenarnya dirancang untuk mengakses satu kondisi khusus dalam HTML.
Berikut merupakan contoh penulisan dari pseudo class dalam CSS :
Beberapa pseudo class yang sering digunakan atau umum digunakanke dalam sebuah halaman web yaitu :
- Link – pseudo class pada penerapan link befungsi untuk menambah style pada link yang belum pernah dikunjungi dan di klik.
- Hover – penerapan pada hover adalah berfungsi untuk menambah style pada elemen pada saat kursor atau mouse berada diatas elemen tersebut.
- Active – berfungsi untuk menambah style pada elemen yang aktif atau sedang aktif.
- Visited – memiliki fungsi untuk menambah style pada link yang sudah pernah dikunjungi sebelumnya atau di klik.
Pengertian Pseudo element
Pseudo Element adalah selector yang memiliki fungsi untuk menyeleksi elemen dan tag secara otomatis. Penulisan pseudo element pada CSS1 dan CSS 2 adlaah dengan menggunakan 1 tanda titik dua (:) yang sama penulisannya seperti pseudo class. Namun pada versi CSS3, pseudo element ditulis dengan menggunakan 2 tanda titik dua (::). Perubahan ini ditujukan dengan maksud agar lebih mudah dalam membedakan antara pseudo element dengan pseudo class
Berikut ini merupakan contoh penggunaan dari pseudo element :
Sekian informasi yang dapat kami sampaikan mengenai pseudo class dan pseudo element, semoga informasi yang kami berikan bermanfaat. Silahkan tinggalkan pertanyaan di kolom komentar jika masih kurang jelas, terimakasih.
Be the first to comment