Iframe宽度和高度不会改变

此iframe的宽度和高度不会改变。我需要响应式设计。请帮忙。Iframe宽度和高度不会改变

现在：

<iframe src="http://www.kadinvekadin.net/mod-burclar.php" 
     frameborder="0" 
     scrolling="no" 
     width="300" 
     height="300">

修改500×500 - 不工作，还是300×300：

<iframe src="http://www.kadinvekadin.net/mod-burclar.php" 
     frameborder="0" 
     scrolling="no" 
     width="500" 
     height="500">

来源

2013-08-27 mogutcan

你需要让你的iframe响应所有页面或你只需要在500 * 500，显示他们呢？ –

我想要响应式设计。但是这个iframe（http://www.kadinvekadin.net/mod-burclar.php）不能调整大小。尺寸不要改变。如何改变宽度/高度？ – mogutcan

此iframe设置最大调整大小300x300。例如，我想要350x350，但我不这样做。 @PrasannaAarthi – mogutcan

您需要环绕容器的iframe和应用样式给它一个纯CSS的解决方案，用于更多详情请参阅http://andmag.se/2011/11/responsive-embeds/

另一种选择是使用jquery 请在织机上https://gist.github.com/aarongustafson/1313517

试试这个代码，

<html> 
<body> 
<style> 
html,body  {height:100%;} 
.wrapper   {width:80%;height:100%;margin:0 auto;background:#CCC} 
.iframe1  {position:relative;} 
.iframe1 .ratio {display:block;width:100%;height:auto;} 
.iframe1 iframe {position:absolute;top:0;left:0;width:100%; height:100%;} 

</style> 
<div class="wrapper"> 
<div class="iframe1"> 

    <img class="ratio" src="sometransparentimage.jpg"/> 
    <iframe src="http://www.kadinvekadin.net/mod-burclar.php" frameborder="0" 

     allowfullscreen></iframe> 
    </div> 

    </div> 
    </body> 
    </html>

来源

2013-08-27 07:40:31

我也试过两个选项。但仍然这个iframe：http://www.kadinvekadin.net/mod-burclar.php不可调整大小。请帮忙。 – mogutcan

试试这个代码，看看你的预期输出是什么.. –

谢谢你我试过这段代码和jQuery。 “sometransparentimage”是响应式的，但iframe不响应。当我调整浏览器窗口的大小时，这个iframe仍然不响应。有没有其他方法可以响应这个iframe？ – mogutcan

Iframe宽度和高度不会改变

回答

相关问题