背景图片不工作

Question

所以，我有两个文件，一个用于 html，另一个用于 CSS 我这样建立了它们之间的联系：

  <link rel="stylesheet" type="text/css" href="CSS/login.css">

这是我的 html 代码，我刚刚开始，所以代码不多

<html>
<head>
    <title>Login</title>
    <link rel="stylesheet" type="text/css" href="CSS/login.css">

</head>
<body >
    <form>
    <div>

    </div>
    </form>
</body>

这是 css 文件

body
{
    background-image:url("../Images/header.jpeg");

}

问题是背景图片不工作

Answer 1

嗯，那是因为你的body里面没有内容。

您可以：

向正文添加内容（显然你会这样做 - 但如果问题出在其他元素上，则应用相同的逻辑）

<html>
<head>
    <title>Login</title>
    <link rel="stylesheet" type="text/css" href="CSS/login.css">
</head>
<body >
    <form>
    <div>
      Background Show
    </div>
    </form>
</body>

或使用 css

添加 height 和 width

body {
  width: 100px;
  height: 100px;
  background-image:url("../Images/header.jpeg");
}

Answer 2

它不起作用，因为您的 body 元素没有宽度或高度。

试试这个：

body
{
    width: 100px;
    height: 100px;
    background-image:url("../Images/header.jpeg");
}

当然你不必给正文一个固定的宽度和高度。只要确保其中有一些内容即可。

Answer 3

我相信如果您在空白 div 之间添加一些内容，您的背景图片应该会显示。

Answer 4

这样试试：Demo

html
{
    background:url("http://www.stockazoo.com/uploads/3/5/4/5/3545172/748777_orig.jpg") no-repeat 100% 100%;
height:100%;
}

为 html, body 指定 height as 100% 以及 background size:100%

Answer 5

乔

请告知文件夹结构或相同的打印屏幕。并让我们知道它是本地主机还是服务器。这可能是因为你的大写字母 CSS 应该是小写字母。

<link rel="stylesheet" type="text/css" href="CSS/login.css">

<link rel="stylesheet" type="text/css" href="css/login.css">

背景图片不工作

background image is not working

html

css

background-image