Question

我的iframe需要小帮助。

我有框架工作正常。

<div id="my-div" style="width:790px; height:240px; overflow-y: hidden; overflow-x: scroll; position:relative;">
<iframe style="position:absolute; top: -245px; left: -3px; width:1280px; height:490px;"
src="http://www.augustyna.pl/prognozy/17dni.php" id="my-iframe" scrolling="no"></iframe>
</div>

但是我必须在1920px中制作我的网站biger并且在这种情况下我的i帧看起来很糟糕，你能告诉我在这种情况下如何解决它吗？

@media screen and (min-width: 1920px) and (-webkit-min-device-pixel-ratio:0) {
  body {
    zoom:130%;
    }
}

这是网站是：www.surfszkola.pl/prognoza 谢谢你的到来！

Answer 1

您可以使用此代码将您喜欢的内容显示为不同的屏幕尺寸：

＆＃13;

iframe {
  border: none;
  width: 100%;
  height: 300px;
  -ms-zoom: 1.5;
  -moz-transform: scale(1.5);
  -moz-transform-origin: 0 0;
  -o-transform: scale(1.5);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(1.5);
  -webkit-transform-origin: 0 0;
}
@media (min-width: 1200px) {
  .content_viewport {
    border: 0px none;
    margin-left: -36px;
    height: 812px;
    margin-top: -486px;
    width: 650px;
  }
}
@media (max-width: 1200px) {
  .content_viewport {
    border: 0px none;
    margin-left: -306px;
    height: 812px;
    margin-top: -86px;
    width: 650px;
  }
}

＆＃13;

<div style="border: 2px solid #D5CC5A; overflow: hidden; margin: 15px auto; max-width: 575px;">
<iframe src="http://augustyna.pl/prognozy/jastarnia.php" scrolling="no" class="content_viewport">
  <p>Your browser does not support iframes.</p>
</iframe>
</div>

＆＃13;

缩放后iframe无法正常工作

1 个答案: