在图像顶部显示 Iframe？

Question

问题

我想在图像中显示 iframe，但不知道如何执行此操作。有没有比纯粹用 css 定位更好的方法？

我有一个显示其他网站的 html 页面，我想在该页面下图的屏幕内显示一个 iframe。

Answer 1

我将屏幕设为背景图像，然后使用绝对定位的 iframe。我在演示中的屏幕上添加了一个 YouTube iframe。

演示

.outer {
    background-image: url('http://i.stack.imgur.com/6hnLq.png');
    width:420px;
    height:365px;
}
.inner {
    position: relative;
    background-color:;
    left: 67px;
    top: 109px;
    width:277px;
    height:150px;
}

………………

<div class="outer"><iframe class="inner"></iframe>

您甚至可以使用 2 或 3 像素的边框半径来匹配图像。