Question

这就是我的所作所为：

.bodyimage { 
  background-image: url('px_by_Gre3g.png');
  background-repeat: repeat;
}

但是，如果我尝试放置任何元素，如p，h1，h2，h3等，它根本不显示。这是我的代码：

<!DOCTYPE HTML>
<html>
<link rel="stylesheet" type="text/css" href="bootstrap.css">
<link rel="stylesheet" type="text/css" href="bootstrap-responsive.css">
<meta charset="UTF-8">
  <head>
    <title>Dave's Website</title>
     </head>
    <body class="bodyimage">
    <p><b>test</b></p>
    </body>

没什么，只是一个简单的网站。我不确定为什么它根本不显示。有人可以帮忙吗？

Answer 1

您的link和meta超出了head，这是无效的。试试这样：

<!DOCTYPE HTML>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="bootstrap.css">
    <link rel="stylesheet" type="text/css" href="bootstrap-responsive.css">
    <meta charset="UTF-8">
    <title>Dave's Website</title>
</head>
<body class="bodyimage">
    <p><b>test</b></p>
</body>
</html>

使用validator检查您的标记。

JSBin使用不同的background-image。

Answer 2

您的图片是透明的还是部分透明的，导致文字不可见？尝试将字体颜色更改为白色或黑色，然后从那里开始工作。

有关图像和字体的详细信息，请参阅以下网站。 http://www.w3.org/wiki/CSS_background_images

Answer 3

要在Twitter Bootstrap中添加正文背景，我将background: url(../img/bg.png) repeat 0 0;添加到

body {
  margin:0;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:14px;
  line-height:20px;
  color:#333;
  background-color:#fff;
  background: url(../img/bg.png) repeat 0 0;
}

放置身体图片后，元素似乎没有显示出来

3 个答案: