ImagesLesson 77Preview gratis
Form on Image
Lesson ini bagian dari How To · Semua level
Ringkasan
Form on image menempatkan formulir di atas gambar latar, biasanya di tengah layar. Panel formulir diberi latar terang agar input tetap jelas, sementara gambar di belakang diberi overlay. Tata letak grid atau flexbox memudahkan pemusatan form secara vertikal dan horizontal.
Poin kunci
- Gambar latar dapat digabung dengan overlay memakai linear-gradient dan url().
- place-items: center pada grid memusatkan form secara dua arah.
- width: min(380px, 100%) membuat form responsif.
- box-sizing: border-box mencegah input melebar melewati kontainer.
- Label dengan atribut for harus terhubung ke id input.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.