0

我正在构建一个系统来创建带有缩略图和播放按钮的“假视频嵌入”。图像来自标准尺寸的服务，因此别无选择，只能在 HTML 中调整它们的大小。另一个限制是，代码块必须是自包含的（如嵌入代码）并且不依赖于任何外部样式表。我将播放按钮覆盖为透明 PNG。我的第一个解决方案是使用内联 css 在覆盖图像上设置负边距，如下所示：

<div style="width:340px;height:280px;">
<img src="thumbnail.jpg" width="340" height="280"/>
<div style="margin-top:-280px;"><a href="link-to.video.html">
<img src="transparent-embed-overlay.png" 
border="0"></a></div></div>

但是在博客的 XML 提要中，透明的播放按钮会从“嵌入”中“脱落”，因为它无法识别内联样式。这迫使我不得不编写一个以图像作为背景图像的单格表格。但是后来我无法调整给定的标准图像缩略图的大小，将我硬塞到默认的缩略图大小。

FWIW，这是我正在使用的代码：

<table width="320" height="240" background="thumbnail.jpg">
<tr><td><a href="link-to-video.html">
<img src="transparent-overlay.jpg" border="0"></a></td></tr></table>
4

1 回答 1

0

您可以发送一个示例的链接吗？

据我了解，您正在动态更改背景标签，但如果不使用 CSS 3，您将无法调整背景图像的大小，因此兼容性会受到影响。

CSS Background 属性可以包含颜色、url、位置 x、y 和重复。

IE。

background: white url("mypic.jpg") 0 0 no-repeat;

Quirksmode CSS 3 背景

为什么您不能在表格中使用 img 标签，您可以动态地将其源更改为新图像并将高度和宽度设置为任何值？

或者，如果您的问题是用户拖动图像，您可以简单地使用 div 而不是图像，设置其高度和宽度，并将其放在图像上。

于 2009-08-15T19:46:49.483 回答