我嵌入了幾個 html 文件，這些文件的「高度」各不相同。我希望嵌入的內容始終填充父級 div，以便我可以滾動父級而不是嵌入的內容。
如果我為內容包裝器設定一個特定的高度，該高度大於嵌入內容的高度，它就可以工作。唯一的問題是，由於內容不同，具體高度與其他嵌入的 html 檔案不匹配，並且會留下大量死空間。我怎麼才能使內容包裝器縮放到嵌入內容的高度？
<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%;
}
我嘗試將嵌入內容和內容包裝器的高度設定為 100% 或自動，但都不起作用。
P粉7412238802024-04-01 09:30:55
我透過使用javascript 將iframe 的高度設定為其內容的高度來解決我的問題，使用此網站：https://www.tutorialrepublic.com/faq/automatically-adjust-iframe-height- according-to-its-內容-使用-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>