Question

我正在尝试使用外部CSS文件对一些HTML文本着色以运行基本测试，但是它不起作用。我已经检查了CSS文件和HTML文件的位置，它们位于同一位置。

我尝试过移动文件，以使它们位于同一位置。我觉得这是问题所在。

代码：

h2 {
  color: red;
}

<!DOCTYPE html>
<html>

<head>
  <title>Hello World</title>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <h2>This is the title</h2>
  <p>Lorem ipsum</p>
</body>

</html>

HTML文件和CSS文件保存在Templates下，Templates是创建的文件夹，用于保存Django项目中的所有前端文件。文件路径可能是原因吗？

这是标题

并没有按预期将颜色更改为红色。

Answer 1

更新：已解决。

这是Django的问题，Django要求您使用settings.py放置目录，以便它可以引用静态文件（也称为css文件）。

在settings.py中，看起来像这样，修改目录以适合：

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
    '/Users/benja/WDTimesheetProject01/templates/css/',

]

STATIC_URL = '/static/'

然后在HTML的最上方放置

{% loadstatic %}

哪个会为您提供带有正确加载的CSS的最终文件：

{% load staticfiles %}
<!DOCTYPE html>

<html>
    <head>
        <title>Hello World</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="{% static 'style.css' %}">
    </head>
    <body>
        <h2>This is the title</h2>
        <p>Lorem ipsum</p>
    </body>
</html>

谢谢！

Answer 2

尝试重新启动浏览器或在其他浏览器上进行事件测试；我有几次这样的问题，那是我的出路

CSS无法正确加载

这是标题

2 个答案: