MoreLesson 221Preview gratis
Responsive Iframes
Lesson ini bagian dari How To · Semua level
Ringkasan
Iframe responsif adalah embed video atau peta yang lebarnya menyesuaikan layar tanpa merusak rasio. Karena iframe memiliki dimensi tetap secara bawaan, ia perlu dibungkus kontainer yang mengatur rasio aspek. Teknik klasik memakai padding-bottom persentase, sedangkan pendekatan modern cukup memakai properti aspect-ratio.
Poin kunci
- Bungkus iframe dengan kontainer yang mengatur lebar dan rasio aspek
- Trik lama: padding-bottom 56.25% untuk rasio 16:9
- Iframe di dalam wrapper diposisikan absolute dengan lebar dan tinggi 100%
- Selalu sertakan atribut title pada iframe untuk aksesibilitas
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.