如何将 youtube 视频放在图像上方？答案

【问题标题】：How to put a youtube video above an image?如何将 youtube 视频放在图像上方？
【发布时间】：2013-10-24 07:54:33
【问题描述】：

我的页面上有一个 youtube 视频，我希望它带有图片边框。非常适合，但我不能玩。

这是链接：

< iframe style="margin-top: 0px; margin-left: 85px;"width="431" height="270" src="http://www.youtube.com/embed/RHaIQWOsxaA?autoplay=0&cc_load_policy=1" frameborder="0" allowfullscreen></iframe>

视频是这样的？

http://kepfeltoltes.hu/131024/354340238asd_www.kepfeltoltes.hu_.jpg

谁能帮帮我。

非常感谢！

***编辑**

谢谢，z-index 累了，现在可以显示视频了，但还是无法播放。 :S

***编辑**

太完美了，非常感谢！

【问题讨论】：

你还没有提供代码来复制这个？
您可能想了解 CSS 绝对定位和 z-index。
查看我更新的答案

标签： javascript html css iframe youtube

【解决方案1】：

这是一个非常基本的解决方案

HTML：

<div class="video-container">
<iframe class="Video" src="http://www.youtube.com/embed/RHaIQWOsxaA?autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>

CSS：

.video-container {
    background: url(http://images.amazon.com/images/G/01/electronics/apple/apple-mbp2011-13-frontface_osx-lg.jpg) no-repeat;
    height: 590px;
    width: 1000px;
}
.Video{
    position:absolute;
    width: 654px;
    height: 411px;
    left: 177px;
    top: 69px;
}

这是Demo

【讨论】：

【解决方案2】：

通过 CSS 将 2 的 z-index 分配给 Iframe，并将 1 的 z-index 分配给图像。

【讨论】：