我目前正在网站上开发混合媒体的旋转蒙太奇。网站上将轮流显示大约 5 个图像/视频。该网站还使用 Ektron CMS,因此我无法确定蒙太奇中的哪些位置是图像,哪些位置是视频。 (这些视频托管在 YouTube 上。)
所以,我的问题是视频加载时与 iframe 的内边缘完美对齐,但图像加载时在 iframe 内有大约 10px 的微小边距,即very不好,因为我们的网站布局非常精确,甚至略有变化one像素可能会搞砸。这只出现在 FireFox 和 IE 中。我已经在 Chrome 和 Safari 中进行了测试,效果非常好。这 4 个浏览器是我们官方支持的唯一 4 个浏览器。
这是我的 HTML:
<head>
<body>
<div id="mainImage">
<iframe scrolling="no" frameborder="0" runat="server" id="MainImage1"
src="http://www.youtube.com/embed/u1zgFlCw8Aw?wmode=transparent">
IFRAMES do not work in your browser</iframe>
<iframe scrolling="no" frameborder="0" runat="server" id="MainImage2"
src="images/default/mainImage/mainImage_02.jpg">
IFRAMES do not work in your browser</iframe>
</div>
</body>
</head
CSS如下:
#mainImage iframe{position:absolute; top:0; left: 0; padding:12px 0 0 12px; display:block;}
#mainImage iframe html, body{ margin:0px; padding:0px; border:0px;}
这是网站上唯一主动影响 iframe 显示方式的代码。
所以,我的问题是,如何消除 iframe 内的边距以及为什么它只显示在 FireFox 和 IE 中???
这好像是marginheight
and marginwidth
也能完成这项工作。看https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe.
我经常使用:
<iframe src="..."
marginwidth="0"
marginheight="0"
hspace="0"
vspace="0"
frameborder="0"
scrolling="no"></iframe>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)