In static file in django the background_image not work

I tried using a code to change the background color and it worked fine. But when I used the background_image code, the code did not work and gave me (Failed to load resource: the server responded with a status of 404 (Not Found)) Although the path is correct This is the path to the image inside the app D:\Todos\Todosproject\static\images\svitlana-j7Ssk0Km8Jo-unsplash.jpg

static/styles

   
body {
 background-image: url('/Todos/Todosproject/static/images/svitlana-j7Ssk0Km8Jo-unsplash.jpg');

}

base.html

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head>
    <meta charset="UTF-8">

    <link rel="stylesheet" type="text/css" href="{% static 'css/styles.css' %}"/>
    <title>
        {% block title %}
        {% endblock title %}
    </title>
</head>
<body>
{% block body %}
{% endblock body %}
</body>
</html>

settings.py in django

STATIC_URL = 'static/'

STATICFILES_DIRS = [BASE_DIR / "static"]

CSS files are not processed by Django's template engine, so you can't use template variable like {% static %}.
Instead what you can do is to use relative url (relative to your CSS file).

If your CSS is stored in /Todos/Todosproject/static/css/ directory, you should use a url relative to that directory.

Example

body {
 background-image: url('../images/svitlana-j7Ssk0Km8Jo-unsplash.jpg');
}
Вернуться на верх