html - 如何在预设图像中嵌入图像或视频

Question

我正在写一个网站介绍页面，非常喜欢这个页面的风格:http://www.davidhutton.com/在另一张图片中有移动的图片/视频。

为简化起见，我如何将图像放入此处的电视容器中:http://jsfiddle.net/h9Nn3/2/

我不确定它有多复杂，但它过于复杂，至少一个起点将不胜感激!

Answer 1

根据你的例子，你可以这样解决:

<style>
div.container {
    width:          337px;
    height:         297px;
    padding:        25px 35px 0px 28px;
    background:     url(http://www.officialpsds.com/images/thumbs/tv-screen-1-psd29071.png) no-repeat 0 0;
}

div.container > div {
    height:         189px;
    overflow:       hidden;
    border:         1px solid red;
}
</style>

<div class="container">
    <div>
        This container should have a red border and fit's exactly the screen.
        You can replace or fill it with everything you want, for example an img-tag.
    </div>
</div>