Question

我有一个django项目，我一直在尝试将css文件链接到base.html文档，以开始向我的文件中添加一些css。我已经连接了引导程序，但我想添加更多自定义......这是我到目前为止所拥有的......

{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
  <link href="{% static 'css/blog.css' %}" rel="stylesheet">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
</head>
<body>
  <div class="container-fluid blue5">
    {% block content %}
    {% endblock %}
  </div>
</body>
</html>

这是css文件

.blue5 {
  background-color: lightblue,
}

Answer 1

您可以像这样链接CSS和HTML文件：

在您的HTML代码中：

{% load staticfiles %}
<!DOCTYPE html>
<html>
    <head>
     <title>{% block title %}{% endblock %}</title>
      <link href="{% static 'css/blog.css' %}" rel="stylesheet">
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">


      <link href="pathToYourCSSfile" rel="stylesheet"> 


      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1"     crossorigin="anonymous"></script>
    </head>
    <body>
      <div class="container-fluid blue5">
        {% block content %}
        {% endblock %}
      </div>
    </body>
</html>

希望这有帮助。

Answer 2

如果您的css文件只包含这两行，最好将它们包含在文档的头部

<head>
    ...
    <script ...>
    <style>
         .blue5 {
             background-color: lightblue,
         }
    </style>
</head>

否则就像其他人一样，添加一个新的链接标记：

<link href="{% static 'path to your file.css' %}" rel="stylesheet">

将css文件链接到基础html docuemnt - django

2 个答案: