javascript - 网站上的多个 iFrame，全部调整为默认高度

Question

很抱歉，如果这个问题已经得到回答，但不能缩小范围或正确提出问题。在这里，我有一个客户的网站，它有三个嵌入式 iFrame，该网站用于假期住宿并使用日历、预订查询和平面图，所有这些都来自不同的 vendor 。问题是它们都有不同的宽度和高度。

在大多数情况下，宽度设置为 100% 没问题，但高度就是问题所在，即使我尝试将高度设置为我想要的高度，它也会默认回到设置的大小。

默认大小为 309px，通常位于网站所需的两个 css 文件中。

是否有一小段代码可以覆盖 CSS 中设置的尺寸？有问题的站点在这里:http://aalen.com.au/aalen1-pims.php主要关注的领域是平面图，它们只是以较小的 iFrame 结束，并没有展示这些平面图的潜力。非常感谢

Answer 1

查看页面，我只能看到一个CSS文件影响了你的iframe，app.css，还有其他的css文件，但没有一个改变元素的高度。

我假设您指的是您网站上的这段代码。

<iframe frameborder="0" height="400" scrolling="no" src="http://pl.an/aalen-1/embed" width="100%"></iframe>

看起来你在两个地方设置了高度，一次是在 app.css 中使用代码:

iframe{
    height:390px;
    text-align: center;
}

您还使用 height 属性设置了 iframe 高度，如第一个代码示例中所示。尝试从 iframe 标记中删除 height="400" 属性，并在 app.css 文件中只包含高度。

以后您可以尝试使用 Firefox developer tools或 Chrome developer tools在页面打开时操作 CSS，以便查看需要更改的内容，以及它将如何影响页面上的其余内容。