【问题标题】:iframe height "100% - X pixels"iframe 高度“100% - X 像素”
【发布时间】:2014-07-08 19:17:38
【问题描述】:

我想剪切我想在我的网站上包含的外部 iframe 的底部区域,在这个框架内有一些我无法修改的链接,如果我点击它们,我会转到另一个大小不同的页面来自原版。

我想做类似<iframe height:100%-20px /> 的事情(我知道没有这样的语法,但我的目标是重现它)

那么,有没有办法隐藏 iframe 底部的所有像素?

【问题讨论】:

    标签: javascript jquery html css iframe


    【解决方案1】:

    看看css中的calc()函数。

    IE10 开始可以使用(IE9 有点不稳定)。

    你可以这样做:

    iframe{
      height: calc(100% - 20px);
    }
    

    如果100% 的高度是100px,那么它会显示为80px(对不起,我的数学很糟糕)。

    您可以通过查看此链接了解更多信息:Uses for Calc()

    参考:CanIUse

    【讨论】:

      【解决方案2】:

      这个怎么样:

          .outer {
              width:300px;
              height:290px;
              overflow:hidden;
          }
      
          <div class="outer">
              <iframe width="300" height="300"></iframe>
          </div>
      

      如果这没有帮助,你有链接吗?

      您可以同时使用外部 div 和 iframe 的 css 以及边框等,使其看起来更完美

      【讨论】:

        【解决方案3】:

        这里有一个基于 BeatAlex 答案的现场演示:

        Demo:http://jsfiddle.net/a7y7V/

        【讨论】:

          猜你喜欢
          • 2016-08-09
          • 1970-01-01
          • 1970-01-01
          • 2012-01-05
          • 2012-07-09
          • 1970-01-01
          • 2015-05-29
          • 2012-09-01
          • 2012-01-14
          相关资源
          最近更新 更多