Html 如何在 <object> 嵌入上获得高度 = 100%
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16584237/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get height=100% on <object> Embed
提问by user2261793
I'm trying to insert the following code but it is not working. I am not able to get 100% height with this. Can anyone help me? Thanks!
我正在尝试插入以下代码,但它不起作用。我无法获得 100% 的高度。谁能帮我?谢谢!
<body style="overflow:hidden;">
<TABLE align=left width=234 border="0" cellpadding="0" cellspacing="0">
<TR>
<TD valign=top align=center WIDTH="234" >
<object data="EmbedPage.html" type="text/html" style="width: 230px;height:100%;"></object>
</TD>
</TR>
</TABLE>
</body>
回答by tak3shi
Use 100vhfor height, if you want to span the embed-object over the full-screen.
如果要将嵌入对象跨越全屏,请使用100vh作为height。
<body>
<object data="EmbedPage.html" type="text/html" style="width:100%;height:100vh;">
</object>
</body>
回答by Rohit Agrawal
try this
尝试这个
<body style="overflow:hidden;height:100%;">
<object data="EmbedPage.html" type="text/html" style="float:left;width:230px;height:100%;">
</object>
</body>
回答by Ma9ic
Just remove it from the table.
把它从桌子上拿下来。
<BODY style="overflow:hidden; height:100%;">
<object data="http://www.misgeret.co.il/Ebay/Famus/SideMenuFamus.html" type="text/html" style="float:left;width:230px;height:100%"></object>
</BODY>
http://jsfiddle.net/ma9ic/QtKMa/5/
http://jsfiddle.net/ma9ic/QtKMa/5/
100% height in a table cell is always a pain. Technically speaking a TD has no height (because that depends on its contents). What you are asking the browser to do is make the child 100% of its parent, which is 100% of its child, which is 100% of its parent ... You can see how that might be a problem.
表格单元格中的 100% 高度总是很痛苦。从技术上讲,TD 没有高度(因为这取决于其内容)。您要求浏览器做的是让孩子成为其父的 100%,即其子的 100%,即其父的 100%……您可以看到这可能是一个问题。
You could try adding an explicit height to the TD and using table-layout:fixed on the table. At least that way the browser knows the height of the parent without needing the height of the child but that still may not work.
您可以尝试向 TD 添加明确的高度并使用 table-layout:fixed 在桌子上。至少这样浏览器不需要孩子的高度就知道父级的高度,但这仍然可能不起作用。
You might need to rethink how you go about this.
您可能需要重新考虑如何处理此问题。
This shows you the result using a set height and using iframes
这显示了使用设置高度和使用 iframe 的结果
<BODY style="overflow:hidden;height:100%;">
<TABLE align=left width=234 border="1" cellpadding="0" cellspacing="0">
<TR>
<TD valign=top align=center WIDTH="234" height="1000">
<iframe src="http://www.misgeret.co.il/Ebay/Famus/SideMenuFamus.html" style="border:0px #FFFFFF none;" name="myiFrame" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="100%" width="100%"></iframe>
</TD>
</TR>
</TABLE>
</BODY>
http://jsfiddle.net/ma9ic/QtKMa/6/
http://jsfiddle.net/ma9ic/QtKMa/6/
Hope this helps
希望这可以帮助
回答by Wei Feng Sun
body, html{
width: 100%;
height: 100%;
}
<body>
<table class="flash-container" style="height: 100%; width:100%">
<tr style="height: 100%; width:100%">
<td style="height: 100%; width:100%">
<object width="100%" height="100%">
<param name="autoPlay" value="true"></param>
<embed allowfullscreen="true" autoPlay="true" flashvars="autoplay=true&play=ture" allownetworking="all" id="pptShow" allowscriptaccess="always" height="100%" src="http://www.weilaijiaoxue.com:9096/upload/2016/4/13/swf_20160413115509559.swf" type="application/x-shockwave-flash" width="100%"></embed>
</object>
</td>
</tr>
</table>
</body>