Question

我有一个带div的html文件，我想用CSS添加背景，以便我可以使用jQuery或JavaScript更改它。

在HTML文件中：

<html>
      <head>
           <link href="style.css" rel="stylesheet" />
      </head>

     <body>
           <div id="mydiv">
           </div>
     </body>
</html>

在style.css我有：

#mydiv {
    background-image: url("images/bg.png");
    width: 100px;
    height: 100px;
}

它显示一个空白页面这个简单代码中的错误

Answer 1

您的代码很好，但您的<div>需要定义的宽度和高度。此外，我替换了您的图片，因此您可以看到它确实工作。

http://jsfiddle.net/d4pyokh9/1/

Answer 2

你的div没有任何内容，因此它不会显示任何内容。如果您想在整个页面上显示背景，请将css更改为：

body {
    background-image: url("images/bg.png");
}

否则将css更改为：

#mydiv {
    background-image: url("images/bg.png");
    min-height: /* some size here */;
    min-width: /* some other size here*/;
}

You also may want to look into background parameters in regards to repeat-x and repeat-y

Answer 3

您应该定义div的宽度和高度以及图像的背景大小，例如（background-size：100％100％;）

Answer 4

mydiv没有高度/宽度，因此背景图片太小而无法看到。

尝试：

#mydiv {
    background-image: url("images/bg.png");
    height: 1000px;
    width: 1000px;
}

然后调整到你想要的尺寸。

div的背景图片

4 个答案:

http://jsfiddle.net/d4pyokh9/1/