iFrame：根据内容自动将高度调整为100％

Question

我做了很多研究，并且接近我想要发生的事情。这个iFrame我一直在我的网站的首页。来源来自另一个网站。无论iFrame内容的内容有多短或多长，我都希望将高度保持在100％或全高。

问题：它没有达到100％。

解决方案：我发现了这篇文章 - Full-screen iframe with a height of 100%

结果：我到了那里！但它造成了另一个问题。请参阅下面的图片了解演示。
- RED框是主要内容或主页面布局 - 黄色框是iFrame - 蓝色箭头和线条是iFrame的位置。

新问题：我实际上差不多了，但是你看，我的iFrame覆盖了网页的内容。它应该保持在蓝线。我在iFrame中添加了一个父div，所以我可以放置position：relative但我的iFrame消失了。此外，它几乎显示了整个内容。检查以下代码：

<div style="margin:0px;padding:0px;overflow:hidden;">
     <iframe style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:150%;width:150%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" src="www.example.com" name="sample" height="150%" width="150%"></iframe>
</div>

新解决方案：不，我没有任何新的解决方案。如果我可以请你们帮我解决这个问题。如果我改变我的iFrame src，我想在不改变高度值的情况下实现iFrame内容的完整或100％显示。无论内容有多长或多短，我都希望高度灵活。我尝试了一个JavaScript，但根据我读过的很多帖子，它不适用于跨域。是的。谢谢！

Answer 1

如果所有其他方法都失败了，您可以随时使用课程。

    <style>
img.Class {width:200px; height:autopx;}
</style>

<img src="UrlOfPicture" class="Class" />