如何在Django网站模板中关联CSS文件与HTML文件？

当然需要做一些适配操作，毕竟Django有自己的模板和静态文件管理规则，以下是一步步的实操步骤：

• 规整静态文件位置
  Django要求CSS、图片、字体这类静态文件放在app目录下的static/[你的app名称]文件夹里。先在你的Django app里创建这个目录，把导出的CSS文件、以及HTML里用到的图片/字体都移进去，确保文件层级和HTML里引用的路径对应。

• 把HTML转成Django模板

  • 在HTML文件顶部加上{% load static %}，这是Django加载静态文件的必备标签。
  • 把HTML里引用CSS的代码替换成Django的静态文件语法：比如原来的<link rel="stylesheet" href="style.css">要改成<link rel="stylesheet" href="{% static '你的app名称/style.css' %}">。
  • 把修改后的HTML文件放到app目录下的templates/[你的app名称]文件夹里（没有就创建这个目录）。

• 确认Django静态配置
  检查项目的settings.py，确保以下配置存在（默认Django已经自带）：

  INSTALLED_APPS = [
      ...
      'django.contrib.staticfiles',
      ...
  ]
  
  STATIC_URL = '/static/'
  

  开发阶段不用额外配置STATIC_ROOT，部署时再处理即可。

• 添加视图和URL映射
  在app的views.py里写一个简单的视图函数：

  from django.shortcuts import render
  
  def custom_page(request):
      return render(request, '你的app名称/你的模板文件名.html')
  

  然后在项目或app的urls.py里添加URL规则：

  from django.urls import path
  from . import views
  
  urlpatterns = [
      ...
      path('custom-page/', views.custom_page, name='custom-page'),
      ...
  ]
  

• 测试验证
  启动Django开发服务器python manage.py runserver，访问http://localhost:8000/custom-page/，看页面样式是否正常加载。如果样式没出来，用浏览器开发者工具检查CSS的请求路径是否返回404，大概率是路径写错了。

额外提醒 #

• 如果导出的HTML里有CDN资源（比如外部JS、字体），直接保留原代码即可，不用改动。
• 要是还没创建Django app，先运行python manage.py startapp 你的app名称再做上面的步骤。

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