所以我有这个标题任务类,但由于某种原因,背景图像不会显示,但是当我单击 Visual Studio 代码中的 url 时,它会显示该 url 中的图像。有谁知道我的代码有什么问题吗?谢谢
.header-task{
background-image: url("..\image\nightlandscape.jpg");
background-repeat: no-repeat;
background-size: 100% 200%;
height: 120px;
position: relative;
}
这是我点击 URL 图像时 Visual Studio 代码的图片
最佳答案
我做了一些挖掘,但就我个人而言,我没有环境来测试它。所以你可能需要自己检查一下。
您可以尝试以下操作吗:
.header-task{
background-image: url("static(image/nightlandscape.jpg"));
background-repeat: no-repeat;
background-size: 100% 200%;
height: 120px;
position: relative;
}
如果您的 STATIC_URL 是“/static/”(我相信它位于 settings.py 中),则这将呈现为:
.header-task{
background-image: url("/static/image/nightlandscape.jpg");
background-repeat: no-repeat;
background-size: 100% 200%;
height: 120px;
position: relative;
}
另一种可能性:
.header-task{
background-image: url('{% static 'nightlandscape.jpg' %}') or url('{% static "/img/nightlandscape.jpg" %}')
background-repeat: no-repeat;
background-size: 100% 200%;
height: 120px;
position: relative;
}
但为此,我认为您需要首先加载静态文件:HTML
中的{% load static%}
,然后加载样式表。
<head>
<style>
{% include "path/to/my_styles.css" %}
</style>
</head>
可能只是将 url("..\image\nightlandscape.jpg")
更改为 url("../image/nightlandscape.jpg")
关于css - django css 背景图像 url 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62482033/