Django应用服务器运行时HTML无法加载CSS问题求助

问题原因 #

你用的href="style.css"是相对当前URL的路径，当访问http://127.0.0.1:8000/profile/create/时，浏览器会请求/profile/create/style.css，但你的CSS文件根本不在这个路由路径下，所以返回404。本地直接打开HTML时，相对路径是相对于文件所在的本地目录，所以能正常加载。

解决步骤 #

按照Django的静态文件规范来处理，分两步：

1. 配置项目的静态文件设置 #

打开settings.py，做以下检查和配置：

• 确保INSTALLED_APPS里包含django.contrib.staticfiles（默认已自带）
• 确认STATIC_URL设置为：

  STATIC_URL = '/static/'
  

• 如果你的CSS文件不在app目录下的static文件夹里，需要添加STATICFILES_DIRS指定静态文件所在目录。比如把CSS放在项目根目录的static文件夹里，就加：

  STATICFILES_DIRS = [
      BASE_DIR / "static",
  ]
  

  （如果是放在某个app的static文件夹里，比如profile/static/style.css，Django会自动识别，无需额外配置）

2. 修改HTML模板的CSS引用方式 #

• 在HTML模板的最顶部（<html>标签之前）添加静态文件加载标签：

  {% load static %}
  

• 把原来的CSS引用改成Django的静态文件模板标签：

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

  这样Django会自动生成正确的绝对路径（比如/static/style.css），不管当前访问的是哪个路由，浏览器都会请求正确的静态文件地址。

额外说明 #

开发环境下，用python manage.py runserver启动服务时，Django会自动处理静态文件的请求；如果是生产环境，需要运行python manage.py collectstatic把所有静态文件收集到STATIC_ROOT指定的目录，再由web服务器（比如Nginx）来处理静态文件请求。

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