You*_*end 5 html css iframe firefox google-chrome
我遇到了Iframes和Firefox的问题.基本上,我将一个IFrame嵌入到一个站点中,因为它占据了整个身体区域.如您所见,它与Google Chrome完美配合.I帧占据了所有的身体区域,没有导航iframe所需的滚动条.
chrome:http://i.stack.imgur.com/muo3U.png
但在Firefox中,它无法正常工作.正如您在此处看到的,只有iframe的一部分可见,滚动条(它们不可见但滚动工作)必须用于导航iframe.这对我的网站来说非常缺乏吸引力.
Firefox:http://i.stack.imgur.com/6Vm1O.png
所以我想知道如何才能让它发挥作用？我搜索和搜索了所有我尝试的解决方案最终都无法正常工作.
这是我的代码和我尝试过的其他代码.
谢谢你的帮助!
你需要设置你的body和html元素height: 100%
尝试这样的事情:
<html style="height: 100%">
<body style="height: 100%">
<div style="width:100%; height:100%; background-color:transparent;">
<iframe src="http://www.google.com/" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
</div>
</body>
</html>
更好的是,将这些规则添加到CSS文件中:
body, html { height: 100%; }
你也可以试试这个:
CSS:
html, body { height: 100%; }
iframe { width: 100%; height: 100%; }
HTML:
<html>
<body>
<iframe src="http://www.google.com" frameborder="0" scrolling="no"></iframe>
</body>
</html>
移动frameborder和滚动到CSS的替代方案
border: none;删除iframe上的边框,同时overflow: hidden;禁用滚动并隐藏任何截断页面的内容(如原始代码).
CSS:
html, body { height: 100%; overflow: hidden; }
iframe { width: 100%; height: 100%; border: none; overflow: hidden; }
HTML:
<html>
<body>
<iframe src="http://en.wikipedia.org"></iframe>
</body>
</html>
| 归档时间： |
|
| 查看次数： |
5435 次 |
| 最近记录： |