Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Skalakan Kandungan Iframe agar Sesuai dengan Laman Web Saya dengan Sempurna?
Menskalakan Kandungan Iframe untuk Paparan Optimum
Menyepadukan iframe ke dalam tapak web anda boleh meningkatkan pengalaman pengguna dengan membenarkan anda memaparkan kandungan luaran. Walau bagaimanapun, mengubah saiz kandungan berbingkai agar muat dengan lancar dalam halaman anda boleh menjadi satu cabaran.
Untuk menangani perkara ini, satu penyelesaian yang berkesan ialah menggunakan transformasi CSS. Contoh kod berikut menunjukkan cara menskalakan kandungan iframe, dalam kes ini halaman HTML, kepada 80% daripada saiz asalnya:
<style> #wrap { width: 600px; height: 390px; padding: 0; overflow: hidden; } #frame { width: 800px; height: 520px; border: 1px solid black; } #frame { -ms-zoom: 0.75; -moz-transform: scale(0.75); -moz-transform-origin: 0 0; -o-transform: scale(0.75); -o-transform-origin: 0 0; -webkit-transform: scale(0.75); -webkit-transform-origin: 0 0; } </style>
Melampirkan iframe dalam elemen div dengan ID " wrap" membolehkan anda menentukan dimensinya dan menghalang bar skrol daripada muncul. Dengan menambahkan transformasi CSS pada iframe itu sendiri, kandungan dikecilkan kepada 75% daripada saiz asalnya.
Perhatikan bahawa anda mungkin perlu melaraskan dimensi div "balut" agar sesuai dengan reka letak khusus anda. Selain itu, menyatakan "limpahan: tersembunyi" pada div "bingkai" boleh berguna untuk menyekat bar skrol jika perlu.
Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Skalakan Kandungan Iframe agar Sesuai dengan Laman Web Saya dengan Sempurna?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!