如何将视频放在图像之上

时间:2012-10-05 17:32:02

标签: html

将视频放在较大的图像上并使其在图像中水平和垂直居中的正确HTML是什么?

以下是视频的代码:

<br>
<div style="float:right;">
  <div id="ext-gen1825" autoplay="false" height="187" width="224" class="ddcPlayer-holder" style="-moz-user-select: none; background-color: #515151; -moz-border-radius: 5px; border-radius: 5px; background-repeat: no-repeat; background-position: center;width: 224px;height: 187px;background-image: url(http://videos2.dealer.com/clients/b/baierlautomotivemars/b9716e230a0d02b7010c94a788f23c9e_clicktoplay_en_US.png);" ddcplayerinfo="http://videos2.dealer.com/clients/b/baierlautomotivemars/b9716e230a0d02b7010c94a788f23c9e.xml-224px-187px">
    &nbsp;
  </div>
</div>

以下是图片的代码:

<img id="ext-gen2174" src="http://pictures.dealer.com/b/baierlusedcars/0487/31f397280a0d02b700ae8af470747bb2.png"href="http://pictures.dealer.com/b/baierlusedcars/0487/31f397280a0d02b700ae8af470747bb2.png" title="Better Story.png" class="wysiwyg-image" tabindex="30000" style="height: 202px; width: 236px;">

2 个答案:

答案 0 :(得分:0)

没有代码,很难确切地知道你在寻找什么......有不同的方法来实现这一目标。

使用背景图像和此div中的视频创建一个div。

也;

使用position: relative;为您的图片添加div,在视频中使用div设置div并设置position: absolute;。相应地设置顶部和左侧css属性(50%,但有时您可能需要更少)。

答案 1 :(得分:0)

我认为最简单的方法是使用表格。该表格只有一个单元格,您可以填充单元格,这将自动为您居中。我在下面使用了iframe,因为这是来自youtube的嵌入视频的默认代码。

<table background="http://www.example.com/images/example.jpg" cellpadding=50>
<tr>
<td>
<iframe width="420" height="315" src="http://www.youtube.com/embed/te6qG4yn-Ps"  frameborder="0" allowfullscreen></iframe>
</td>
</tr>
</table>