Django项目中CSS样式未生效，背景图片报404错误求助

核心问题 #

你的.contact-container样式不生效是因为背景图片路径错误：

• 你的CSS文件存放在static/images/custom.css，当CSS中写url('images/aaa.jpg')时，浏览器会解析为static/images/images/aaa.jpg，而实际图片应该在static/images/目录下，导致404错误，进而影响整个样式生效。

解决方案 #

方案1：直接修正CSS中的图片路径

修改custom.css里的背景图片路径为当前目录下的图片：

.contact-container {
  background-image      : url('aaa.jpg');
  background-attachment : fixed;
  background-size       : cover;
}

这样浏览器会正确请求static/images/aaa.jpg。

方案2：优化静态文件目录结构（推荐）

将CSS和图片分开存放，避免路径混淆：

1. 调整静态文件目录：
   • 创建static/css/目录，把custom.css移进去
   • 图片保留在static/images/目录
2. 修改HTML中的CSS引用：

{% load static %}
<link rel="stylesheet" href="{% static 'css/custom.css' %}">

3. 修改CSS中的图片路径：

.contact-container {
  background-image      : url('../images/aaa.jpg');
  background-attachment : fixed;
  background-size       : cover;
}

额外检查 #

确保aaa.jpg确实存在于对应的静态目录中，开发环境下Django会自动处理静态文件访问；生产环境需要执行python manage.py collectstatic命令收集静态文件。

内容的提问来源于stack exchange，提问作者Dima Gerchikov