iframe 宽度和高度值

Posted 2023-03-06

【中文标题】iframe 宽度和高度值

【英文标题】：Iframe width and Height values

【发布时间】：2016-08-02 11:43:42

【问题描述】：

我已经直接从网站上复制了关于我的 iframe 的代码，这些代码直接放在了我的代码中。但是，当创建一个类 iframe 时，它似乎没有从 CSS 上创建的类中读取值，但是当我将其直接粘贴到我的代码中时，它会从随附的代码中带来自己的大小。 我怎样才能重新调整我的 iframe 的大小，以便它可以直接从类（CSS）中准备好。我已经删除并删除了高度和宽度，并从它的类中设置了大小，它不会进行更改

这是我的 iframe 代码

      <div class="iframe">

            <iframe src="https://sway.com/s/3HuzZFFkT18WUe4M/embed"  margin  margin scrolling="no" frameborder="no" class="iframee" style="border: none; max-width:100%; max-height:100vh" allowfullscreen webkitallowfullscreen
mozallowfullscreen msallowfullscreen></iframe>

  </div>

我的 CSS - 这个宽度和高度对代码没有影响

.iframe 
    height: 100px;
    width: 600px;
    margin-left:auto;
    margin-right:auto;

    

【问题讨论】：

我今天偶然发现了你的问题。引起我注意的是您在 iframe 中使用 sway.com 网站，这也是我现在正在尝试的。我想知道您的页面是否仍在工作，因为目前 sway.com 服务器似乎正在将 X-Frame-Options 设置为 SAMEORIGIN，因此 iframe 什么也不显示。

你可以使用 mozila fireforce inspector 轻松复制

【参考方案1】：

您正在使用 css 类对外部 div 进行样式更改，但 iframe 标记的样式保持不变。您可以将 css 放在 iframe 标记上，例如：

    iframe
    
        max-height: 200vh;
        height:200px;