Html CSS中的图像背景？_Html_Css

Html CSS中的图像背景？

html css

Html CSS中的图像背景？,html,css,Html,Css,正在尝试将图像背景加载到我的web项目中，但它不起作用。我尝试在body标签中使用style，但仍然没有成功。我想这可能是因为路径的原因，但即使将img移动到同一个文件夹以便在本地加载它也不起作用 <!doctype html> <html> <style> body { background-image: url(Images/red.png); } ul{ width: 100%; } ul li{ display: inline-block;

正在尝试将图像背景加载到我的web项目中，但它不起作用。我尝试在body标签中使用

style

，但仍然没有成功。我想这可能是因为路径的原因，但即使将img移动到同一个文件夹以便在本地加载它也不起作用

<!doctype html>
<html>
<style>
body {
  background-image: url(Images/red.png);
}
ul{
  width: 100%;
}
ul li{
  display: inline-block;
  font-size: 40px;
  padding-right: 40px;
  align-items: center;
}
</style>

<head>
  <title>Coding for fun</title>
</head>
<body>
  <h1>HEYY</h1>
  <h1>HEYY</h1>
  <h1>TESTING FOR IMAGE!</h1>
  <h1>PYTHON and DJANGO</h1>
  <ul class="navBar">
    {% for my_sub in my_test %}
    <li><a href="contact/"> {{ my_sub}} </a></li>
    {% endfor %}
  </ul>
</body>
</html>


身体{
背景图片：url（Images/red.png）；
}
保险商实验室{
宽度：100%；
}
ulli{
显示：内联块；
字体大小：40px；
右边填充：40px；
对齐项目：居中；
}
为乐趣而编码
嘿
嘿
测试图像！
PYTHON和DJANGO

{我的_测试中我的_sub的百分比%}

{%endfor%}

图像的两个尝试路径：

首先

User/…/mainfolder/images/red.png

这是一个子文件夹

第二个

Users/../mainfolder/red.png

这是在html文件夹中。

在处理背景图像时，我总是会给出更多参数。尝试如下操作

主体

（只是一次尝试）

此外，您可能忘记在文件名上使用引号？

您需要设置此

背景图像：url（Images/red.png）
对于这个背景图像：url（'Images/red.png'）
url（）中的值必须是字符串
如果在浏览器中的开发工具中查找，是否会给出错误？如果您的图像与HTML文件位于同一目录下的文件夹images
，您所拥有的应该可以工作。您声明img位于同一文件夹中，但您引用的是当前目录中名为images的文件夹。看看亲戚paths@disinfor图像在该文件夹中是的。它给了我一个“未找到图像”错误，但不确定原因。@Albinwärme我正在用那个文件夹进行测试。正如我在帖子中所说，我确实尝试过加载它，但没有将其放入其他文件夹中，正如您在这里看到的，background image属性可以工作：。您的图像路径很可能存在问题。他在询问如何实现背景图像。。这就是代码的作用。事实上，我尝试了加引号和不加引号，因为有些教程同时使用了这两种方法。这给了我一个根本找不到图像的错误。GabrielTheCoder，在这种情况下的问题是我要说明的文件路径。正如OP所说的那样，这些引语并不影响比赛结果css@STOPIMACODER如果您试图将
移动到头部
，该怎么办？我从来没有在头上使用过“内联样式”，但仍然没有成功。我以前试过@GabrielTheCoderEven虽然我总是使用引号，但代码在没有引号的情况下可以工作。请尝试在css中将宽度：100%
和高度：100vh设置为正文
body{
   background: #f9f9f9 url('images/red.jpg') center center no-repeat; //i recommend lowercase folder and file names
   background-size: cover;
}