背景问题

Question

我需要创建一个可以在单个文件中打开并运行的小型网站。我无法弄清楚如何让图像背景显示出来。我在Desktop/assignment/Website-Background.jpg中有我的形象。我尝试了一些不同的方法让它工作，但它不会。我目前的代码是：

 body{
    height: 100%;
}

.bg { 
    background-image: url("Website-Background.jpg");
    height: 100%; 
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

我也试过试过

body {
  background-image: url("Website-Background.jpg");
}

有人可以指出我做错了吗？

Answer 1

首先在你的浏览器中按F12，你会在控制台窗口中看到是否正在调用图像，然后如果正在调用它并且没有错误，则可以设置200px的高度并查看图像是否显示

Answer 2

只需将图片和html文档放在同一个文件夹中，您的代码就像魅力一样...您将不得不在代码中进行任何更改，以使其正常工作..

Answer 3

我不相信你正确地指出了图像的位置。请记住，对于CSS，您必须退出文件夹并进入其他人才能找到该文件。你的HTML文件在哪里？您可能必须退出其位置并进入分配文件夹。

如果你要退出：

body {
  background:url("../assignment/Website-background.jpg");
  background-size:cover;
}

如果您只是想深入了解文件夹：

body {
  background:url("assignment/Website-background.jpg");
  background-size:cover;
}

Answer 4

请注意，如果你真的＆＃34;想要将您的网站作为单个文件（意味着背景图像是另一个文件），您可以通过某个工具（like）将图像编码为base64，然后将其存储在您的文件中。