Django引入CSS文件时持续出现MIME类型错误求助

我知道这个问题之前有人问过，但论坛上的各种解决方案我都试过了，目前都没奏效。我一直收到404错误：拒绝应用来自'http://127.0.0.1:8000/projects/projects.css'的样式，因为它的MIME类型('text/html')不是受支持的样式表MIME类型，且已启用严格MIME检查。我原以为HTML里的链接语句是正确的，也尝试添加了text/css类型，但错误依然存在。

相关文件 #

HTML模板文件 #

{% include 'main.html' %}
{% load static %}
<head>
    <link rel="stylesheet" type="text/css" href="projects.css"/>
</head>
<body>
<h1 style="text-align: center">Projects</h1>
    <h1>{{projects}}</h1>
    {% for project in context %}
    {% with 'jweb/images/'|add:project.image as project_photo %}
        <div class="card-wrap">
            <div class="card">
                <h2 class="card-header">{{project.title}}</h2>
                    <div class="card-image">
                        <img src="{% static project_photo %}">
                     </div>
            </div>
        </div>
    {% endwith %}
    {% endfor %}
</body>
{% include 'pagebottom.html' %}

CSS文件（projects.css） #

.card-wrap{
    width: auto;
}
.card{
    background: blue;
    padding:3rem;
    border:none;
    box-shadow: 0 2px 5px 0 rgb(0,0,.2);
    border-radius: .25rem;
}
.card-image{
    min-width: 0;
    min-width: 0;
}
.card-image > img{
    height:100%;
    width:100%;
    object-fit:contain;
}

settings.py配置 #

import os
import mimetypes
mimetypes.add_type("text/css", ".css", True)
from pathlib import Path

BASE_DIR = Path(__file__).resolve().parent.parent
DEBUG = True
ALLOWED_HOSTS = []

INSTALLED_APPS = [
    "django.contrib.admin",
    "django.contrib.auth",
    "django.contrib.contenttypes",
    "django.contrib.sessions",
    "django.contrib.messages",
    "django.contrib.staticfiles",
    "blog"
]

MIDDLEWARE = [
    "django.middleware.security.SecurityMiddleware",
    "django.contrib.sessions.middleware.SessionMiddleware",
    "django.middleware.common.CommonMiddleware",
    "django.middleware.csrf.CsrfViewMiddleware",
    "django.contrib.auth.middleware.AuthenticationMiddleware",
    "django.contrib.messages.middleware.MessageMiddleware",
    "django.middleware.clickjacking.XFrameOptionsMiddleware",
]

ROOT_URLCONF = "jweb.urls"

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        "DIRS": [
            BASE_DIR / 'templates'
        ],
        "APP_DIRS": True,
        "OPTIONS": {
            "context_processors": [
                "django.template.context_processors.debug",
                "django.template.context_processors.request",
                "django.contrib.auth.context_processors.auth",
                "django.contrib.messages.context_processors.messages",
            ],
        },
    },
]

WSGI_APPLICATION = "jweb.wsgi.application"

DATABASES = {
    "default": {
        "ENGINE": "django.db.backends.sqlite3",
        "NAME": BASE_DIR / "db.sqlite3",
    }
}


STATIC_URL = "static/"

STATICFILES_DIRS = [
    BASE_DIR / 'static'
]

文件夹结构 #

问题原因及解决步骤 #

核心问题 #

当前引用CSS用的是相对路径，浏览器会从当前页面路由（/projects/）下去找projects.css，但这个路径下没有对应的静态文件，Django返回了404页面（HTML类型），因此出现MIME类型不匹配的错误。

解决步骤 #

1. 确认CSS文件位置
   从文件夹结构看，projects.css需放在与jweb同级的static目录下，确保路径为/static/projects.css。

2. 修改HTML中CSS引用方式
   既然已经加载了static模板标签，直接用它生成正确的静态文件URL，替换原有相对路径：

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

3. 验证静态文件配置
   你的settings.py中STATIC_URL和STATICFILES_DIRS配置是正确的，保持DEBUG=True即可让Django自动处理静态文件请求。

4. 清理浏览器缓存
   按Ctrl+Shift+R强制刷新页面，清除旧的缓存请求，重新加载资源。

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