Ada beberapa pseudo-class CSS yang berkaitan dengan validasi form . Berikut penjelasan lengkapnya: 1. :valid Menargetkan elemen input yang valid berdasarkan aturan HTML. 📌 Digunakan untuk menandai input yang benar . input:valid { border: 1px solid green; } Hasilnya : Jika input memenuhi syarat (misalnya panjang minimal), border berubah hijau. 2. :invalid Menargetkan elemen input yang tidak valid. 📌 Langsung aktif sejak awal jika input kosong & required . input:invalid { border: 1px solid red; } Masalah : Semua input kosong akan langsung merah meskipun pengguna belum mengetik. 3. :user-valid (🔄 Mirip :valid , tetapi lebih user-friendly) Menargetkan input yang valid setelah pengguna mulai mengetik . input:user-valid { border: 1px solid green; } Bedanya dengan :valid : Tidak langsung hijau saat halaman dimuat. Baru berubah setelah pengguna mengisi input dengan benar. 4. :user-invalid (🔄 Mirip :invalid , tetapi lebih user-friendly) Menargetkan inp...
Blog ini ditujukan untuk saling berbagi informasi atau sekedar catatan harian.