html - Flash 对象使 css 布局崩溃？ (只有firefox，chrome都完美!)

标签 html flash css

嘿 stackoverflow 社区，

我对 Flash 对象/嵌入式有问题...

这就是图像......所以它应该是。

This is correct Flash 对象/嵌入式也是如此......

This is incorrect 实际上，“不透明度”CSS 不适用于 Flash 对象/嵌入式。白色的 div 也不会可见。但如果我给你看一个黑色的 div，你不会明白我的意思。

我该如何解决这个问题？

提前谢谢你:)

最佳答案

感谢您上传 fiddle ，如您所见，我将其 fork 并使其现在可以在两种浏览器中使用。

诀窍是将 ?wmode=transparent 添加到 youtube URL 上传递的参数。

Here's a lot more information on that issue

这是您问题的解决方案:

fiddle Demo

HTML

<iframe width="500" height="500" src="//www.youtube.com/embed/0lrrUwyTw2c?wmode=transparent&rel=0" frameborder="0" allowfullscreen></iframe>

<div class="cover"></div>

CSS

body {
    margin: 0;
    padding: 0;
}
.cover {
    position: absolute;
    z-index: 2;
    border-radius: 0 50px 0 0;
    top: 0;
    left: 0;
    background: #767676;
    width: 500px;
    height: 500px;
}

请注意，我稍微清理了代码并使内容更具可读性。