使用背景图像会消除元素中的文本

Question

我有一个非常简单的背景模式，我想在我的网站上使用，每次我在一个元素中设置它，无论是div还是只是将其定义为身体背景图像，它消除了文本。

设置背景颜色工作正常似乎工作正常，文本仍然显示。但是一旦背景是图像，文本就会完全消失。

任何人都有任何想法？谢谢。

Answer 1

以下是它应该如何看的基本示例。工作正常，将您的代码与此进行比较。

HTML

<div class="backgroundImage">
  <h2>This is text</h2>
</div>

CSS

.backgroundImage {
 background:url('http://placehold.it/200x200') no-repeat;
  height:200px;
  width:200px;
}

Answer 2

你的问题太宽泛了。请提供更多详细信息。

背后的可能原因（基于我的心灵能力）：

• z-index正在对文字进行imgs。
• 您可能会对background-image内的css属性进行不正确的编码。

这是为背景定义图像的正确方法。

在这里小提琴：http://jsfiddle.net/uJqG7/

<强> HTML：

<div id="container">
    <p>Hello world!</p>
    <h2>Text Works</h2>
</div>

<强> CSS：

#container {
    background:url('http://www.hdwallpapers3g.com/wp-content/uploads/2014/01/Images-1.jpg');
    width:500px;
    height:300px;
}