在表格单元格中浮动图像

Question

我正在尝试将文本浮动到表格中第一行第3列中的图像上。这个单元格中有一个<img>（由psd切片处理），我想在其上放置文本。我尝试了float: left和position: absolute，但似乎没有任何效果。

有什么想法吗？

Answer 1

position:absolute与z-index结合应该有效。

如果您的设计中有可能，您还可以将图像用作表格单元格的背景，并将文本作为其内容。

修改：另请参阅this question，了解我在IE浏览器中遇到的问题，图片顶部有文字。

Answer 2

虽然我也推荐使用规范方法（将图像作为背景），但这是一个仅通过定位来实现的解决方案：

<td style="position:relative;">
    <img src="..." style="position:absolute;z-index:1;" />
    <div style="z-index:2;position:relative;">your text goes here</div>
</td>

您可能会发现它有助于进一步参考。