Django新手求助：CSS文件加载失败，仅显示HTML内容

安全阿岳

2026-5-29

解决Django中CSS未生效的问题

嘿，作为刚接触Django的新手，遇到CSS不生效的问题太常见了！我帮你一步步排查可能的原因：

1. 确认settings.py的静态文件配置

首先检查你的settings.py里这几个关键配置：

STATIC_URL：确保它设置为'/static/'（这是默认值，但如果被修改过就会出问题）：
```
STATIC_URL = '/static/'
```
STATICFILES_DIRS：如果你的static文件夹在项目根目录（和manage.py同级），必须手动添加这个配置，告诉Django去哪里找静态文件：
```
from pathlib import Path

BASE_DIR = Path(__file__).resolve().parent.parent

STATICFILES_DIRS = [
    BASE_DIR / "static",
]
```
注：默认Django只会自动查找每个app下的static文件夹，项目根目录的static需要显式声明。

确认你的文件结构确实是：项目根目录/static/style/style.css，没有拼写错误（尤其是大小写！Linux/macOS系统对文件名大小写敏感）。
可以直接在浏览器地址栏访问生成的静态文件URL（比如http://localhost:8000/static/style/style.css），如果能看到CSS内容，说明路径没问题；如果显示404，那就是路径配置或文件位置错了。

确保settings.py中DEBUG = True：开发环境下只有开启DEBUG，Django的内置服务器才会自动处理静态文件请求。如果DEBUG设为False，开发服务器不会提供静态文件，这时候需要用python manage.py collectstatic命令收集静态文件到STATIC_ROOT目录（但新手阶段一般不用这个）。

在Django 3.0及以上版本，{% load staticfiles %}已经被更简洁的{% load static %}替代，虽然旧标签还兼容，但建议换成新的试试：

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

按Ctrl+F5强制刷新页面，清除浏览器缓存，有时候旧的缓存会导致样式不更新。
打开浏览器开发者工具（F12），切换到Network标签，刷新页面后查看style.css的请求状态：
- 如果是404：路径配置错误，回到步骤1和2排查；
- 如果是200但样式不生效：检查CSS文件本身有没有语法错误，或者选择器是否匹配HTML元素。

你提到已经安装了django.contrib.staticfiles，再确认下settings.py的INSTALLED_APPS里确实有它：

INSTALLED_APPS = [
    ...
    'django.contrib.staticfiles',
    ...
]

按照这些步骤排查，应该能解决你的CSS不生效问题啦！

内容的提问来源于stack exchange，提问作者mike-gallego