如何让文本显示在背景图像上？

Question

我已经成功地将一张照片设置为我的网站的背景，并让它填充页面，所以它是固定的，而不是平铺的。现在，我希望导航栏出现在图像的中心。然而，尽管我已经将图像质量设置为“背景”，导航栏仍然隐藏在背景图像的后面。我怎样才能使它出现在图像的中心。以下是我对图像使用的编码：

<div>
<table cellspacing="0" cellpadding="0">
    <tr>
        <td>
            <img id="backgroundimage" src="websitebackground.jpg" />
        </td>
    </tr>
</table>
</div>
<style>
body, html { margin:0; padding:0; height:100%; }
#backgroundimage { position:fixed; left:0; top:0; z-index:1; height:100%; width:100%; }
</style>

Answer 1

除非要显示表格数据，否则不要使用表格。取而代之的是这样做

HTML

<div id="backgroundimage">
    //header content goes in here
</div>

CSS

#backgroundimage{
    background-image: url("path-to-image");
    //other styles here
}

Answer 2

您的图像来源不正确，您没有将其作为背景图像使用

<body background="websitebackground.jpg" id="backgroundimage">

这应该会将图像放在文本后面的背景中。