ImagesLesson 82Preview gratis
Rounded Images
Lesson ini bagian dari How To · Semua level
Ringkasan
Rounded images dibuat dengan border-radius untuk melunakkan sudut atau membentuk lingkaran. Sudut membulat cukup memakai nilai piksel atau persen, sedangkan lingkaran sempurna memerlukan lebar dan tinggi yang sama serta radius 50%. object-fit: cover menjaga isi gambar tetap proporsional.
Poin kunci
- border-radius: 16px membulatkan sudut gambar.
- border-radius: 50% pada elemen persegi menghasilkan lingkaran.
- Lebar dan tinggi harus sama untuk lingkaran yang simetris.
- object-fit: cover mencegah gambar gepeng di dalam lingkaran.
- Nilai persen dihitung terhadap dimensi elemen, sehingga hasilnya bisa elips jika rasio tidak sama.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.