简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Benamkan/iframe sentiasa tinggi penuh
P粉021553460
P粉021553460 2024-03-31 09:50:18
0
1
407

Saya telah membenamkan beberapa fail html yang mempunyai "ketinggian" yang berbeza. Saya mahu kandungan terbenam sentiasa mengisi div induk supaya saya boleh menatal induk dan bukannya kandungan terbenam.

Jika saya menetapkan ketinggian khusus untuk pembalut kandungan yang lebih besar daripada ketinggian kandungan terbenam, ia berfungsi. Satu-satunya masalah ialah ketinggian khusus tidak sepadan dengan fail html terbenam lain kerana kandungan yang berbeza dan meninggalkan banyak ruang kosong. Bagaimanakah saya boleh membuat skala pembalut kandungan kepada ketinggian kandungan terbenam? 

<body onload="mathSubject()">
  <div class="nav">
      
  </div>
    
  <div class="content-wrapper">
      <embed id="embedded-content" type="text/html" src="content.html">
  </div>
</body>
.content-wrapper{
    width: 80vw;
    height: 90vh;
    margin-left: auto;
    margin-right: auto;
}

#embedded-content{
  width: 100%;
  height: 100%;
}

Saya cuba menetapkan ketinggian kandungan terbenam dan pembungkus kandungan kepada 100% atau automatik, tetapi kedua-duanya tidak berjaya.

P粉021553460
P粉021553460

membalas semua(1)
P粉741223880
P粉7412238802024-04-01 09:30:55 Tingkat 1

Saya menyelesaikan masalah saya dengan menggunakan javascript untuk menetapkan ketinggian iframe kepada ketinggian kandungannya, menggunakan tapak web ini: https://www.tutorialrepublic.com/faq/automatically-adjust-iframe-height-according-to- its -content-using-javascript.php

<style>
iframe{
    width: 100%;
    border: 2px solid #ccc;
}
</style>

<iframe src="demo.php" id="myIframe"></iframe>

<script>
// Selecting the iframe element
var iframe = document.getElementById("myIframe");

// Adjusting the iframe height onload event
iframe.onload = function(){
    iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 'px';
}
</script>
Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！