Question

由于某种原因，当我尝试向div添加文本时，它巧妙地错过了它。

我试图将文字放在div中，但是它不在其中。

这是一个JFIDDLE：http://jsfiddle.net/hspwtyag/1/

<div align="center">
<div id="box1">
<img src="https://upload.wikimedia.org/wikipedia/commons/c/cc/Rectangle_.png" />
</div>

<div id="box2">
<h2>Proudly celebrating 10 years</h2>
</div>
</div>

* {
 background-image: url("http://images.virtualworldsland.com/blog/2322/796.jpg");
 background-attachment: fixed;
}

#box1 {
 border-radius: 1px solid black;
 width: 500px;
 background: white;
 border-radius: 15px 15px 15px 15px ;
}

#box2 {
 border-radius: 1px solid black;
 width: 500px;
 background: white;
 border-radius: 15px 15px 15px 15px ;
 height: 150px;
}

Answer 1

- 它只是你的背景图片，它会欺骗你。

请参阅，如果我删除了背景图片，并更改了div的颜色，Proudly celebrating 10 years可以看到里面红色（即。里面 the div）。

＆＃13;

#box1 {
  border-radius: 1px solid black;
  width: 500px;
  background: white;
  border-radius: 15px 15px 15px 15px;
}
#box2 {
  border-radius: 1px solid black;
  width: 500px;
  background: red;
  border-radius: 15px 15px 15px 15px;
  height: 150px;
}

＆＃13;

<div align="center">
  <div id="box1">
    <img src="https://upload.wikimedia.org/wikipedia/commons/c/cc/Rectangle_.png" />
  </div>

  <div id="box2">
    <h2>Proudly celebrating 10 years</h2>
  </div>
</div>

＆＃13;

答案 1 :(得分：2)

问题是您为图像设置了所有内容的背景。将它改为身体，你就没事了。

body {
 background-image: url("http://images.virtualworldsland.com/blog/2322/796.jpg");
 background-attachment: fixed;
}

http://jsfiddle.net/hspwtyag/2/

答案 2 :(得分：0)

您没有正确地将背景添加到页面中如果你这样做它应该工作：

html{
 background-image: url("http://images.virtualworldsland.com/blog/2322/796.jpg");
background-attachment: fixed;
}

#box1 {
 border-radius: 1px solid black;
 width: 500px;
 background: white;
 border-radius: 15px 15px 15px 15px ;
 }

#box2 {
 border-radius: 1px solid black;
 width: 500px;
  background: white;
 border-radius: 15px 15px 15px 15px ;
 height: 150px;
}

JSFIDDLE

Answer 2

问题是您为图像设置了所有内容的背景。将它改为身体，你就没事了。

body {
 background-image: url("http://images.virtualworldsland.com/blog/2322/796.jpg");
 background-attachment: fixed;
}

http://jsfiddle.net/hspwtyag/2/

Answer 3

您没有正确地将背景添加到页面中如果你这样做它应该工作：

html{
 background-image: url("http://images.virtualworldsland.com/blog/2322/796.jpg");
background-attachment: fixed;
}

#box1 {
 border-radius: 1px solid black;
 width: 500px;
 background: white;
 border-radius: 15px 15px 15px 15px ;
 }

#box2 {
 border-radius: 1px solid black;
 width: 500px;
  background: white;
 border-radius: 15px 15px 15px 15px ;
 height: 150px;
}

JSFIDDLE

Div之外的文字

3 个答案: