javascript - bootstrap 4 中的完整内容 iframe

Question

我正在尝试在我的页面中嵌入预约安排前端的 iframe。调度程序响应迅速，当嵌入我的页面时，宽度很好。问题是框​​架高度很小。我已经尝试过改变我能想到的所有 css。我尝试了多种不同的 css 技巧都无济于事。这可能仅使用 css 吗？我可以访问两台服务器。下面是我到目前为止所拥有的图片。如果内容是全高那就完美了。

我在 stackoverflow 和网络上阅读了多篇文章。我尝试了该站点上的所有内容，不行。 https://benmarshall.me/responsive-iframes/
这是我现在拥有的图像:

<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://xxx" allowfullscreen></iframe>
</div>

我希望 iframe 是 iframe 内容的全高。 任何帮助/方向将不胜感激。

Answer 1

我终于能够使用 CSS 完成这项工作。我有一个响应式样式表，它覆盖了我的 css 类。我添加了以下代码，它对我有用。幸运的是，我可以访问 iframe 内容并知道我需要的高度。为了使其以这种方式工作，iframe 内容必须已经响应。我使用了以下代码，一切正常。真希望我没有在这么简单的事情上花那么多时间，但很高兴我做到了。

.embed-responsive-full {
    padding-top: 100%;
    height: 720px;
}