带有django的静态文件中css样式的背景图像
我用它在django项目中创建了一个主页,但是我无法正确显示背景图像(bg.jpg) 背景图像在css文件中用作背景图像:带有django的静态文件中css样式的背景图像,css,django,image,django-staticfiles,Css,Django,Image,Django Staticfiles,我用它在django项目中创建了一个主页,但是我无法正确显示背景图像(bg.jpg) 背景图像在css文件中用作背景图像: .wrapper.style3 { background-color: #000; color: #bfbfbf; background-image: url(/media/usr/path_to_project/project_name/home/static/images/bg.jpg); background-size: cover;
.wrapper.style3 {
background-color: #000;
color: #bfbfbf;
background-image: url(/media/usr/path_to_project/project_name/home/static/images/bg.jpg);
background-size: cover;
background-attachment: fixed;
background-position: center;
position: relative;
}
我读了这些主题
project_name
- home
- static
--home
---style.css
--images
---bg.jpg
- templates
-- home
---base.html
---home_template.html
在style.css文件中,我尝试了以下方法
background-image: url(/media/usr/path_to_project/project_name/home/static/images/bg.jpg);
background-image: url("/media/usr/path_to_project/project_name/home/static/images/bg.jpg");
background-image: url(../images/bg.jpg);
background-image: url("../images/bg.jpg");
background-image: url("{% static 'images.bg.jpg' %});
在my base.html模板中,我有:
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'home/style.css' %}"/>
{%load static%}
在我的home_template.html中
{% block body %}
{% load staticfiles %}
<section id="two" class="wrapper style3">
<div class="inner">
<header class="align-center">
<p>Nam vel ante sit amet libero scelerisque facilisis eleifend vitae urna</p>
<h2>Morbi maximus justo</h2>
</header>
</div>
</section>
{% endblock %}
{%block body%}
{%load staticfiles%}
在这里,你可以坐在自由的椅子上,享受生活的乐趣
莫比·马克西姆斯·胡斯托
{%endblock%}
奇怪的是,我的static/images目录中还有其他图像,它们在模板中以内联样式显示,例如:
<div class="image fit">
<img src="{% static 'images/pic03.jpg' %}" alt="" />
</div>
您只需使用背景图像:url('/static/images/bg.jpg')代码>,因为Django会自动将/static
映射到正确的文件夹。有一个特殊的设置来处理静态文件的服务方式:
这是正确的使用路径。可能您的图像已损坏,或者我以前也遇到过类似情况,问题是图像的大小不一。尝试直接从url打开img以了解它是否是css问题?