Django、html、css页脚样式适用于所有正文

2024-09-28 22:20:22 发布

您现在位置：Python中文网/ 问答频道 /正文
9444 3

我有一个如下结构的网页，我想有一个background-color: #aa2222属性，只应用于页脚。在

<body>
      {% block sidebar %}<!-- insert default navigation text for every page -->{% endblock %}
      {% block content %}<!-- default content text (typically empty) -->
      <!-- Navigation Bar -->
      <section class="navbarSection">
        <div class="topnav" id="myTopnav">
          ...
        </div>
      </section>
      <!-- End of Navigation Bar -->
      <!-- Articles -->
      <section class="articleSection">
        <div class="articles" id="myArticles">
          {% for article in articles %}
          ...
          {% endfor %}
        </div>
      </section>
      <!-- Footer -->
      <footer id="site-footer">
        <div id="footer1">
          <p> footer text </p>
        </div>
      </footer>
      <!-- End of Footer -->
</body>

页脚的样式如下：

^{pr2}$

此时页面显示的是带有background-color:#aa2222的所有正文，而不是只有页脚。 它似乎与Django有关，因为在web编辑器中使用代码时，它只将背景色正确地应用于页脚。 你能帮忙吗？在

EDIT1：按照建议，我尝试添加一个页脚.html模板文件夹中的文件，如下所示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

  <!-- Footer -->
  <footer id="site-footer">
    <div id="footer1">
      <p> footer text </p>
    </div>
  </footer>
  <!-- End of Footer -->

</body>
</html>

然后我在index.html中添加了标记{% include "templates/footer.html" %}，但是在运行python manage.py runserver时，我收到了一个错误TemplateDoesNotExist at /home/


Tags： oftextdividhtmlsectionbodyclass
2条回答
网友
1楼 · 编辑于 2024-09-28 22:20:22

解决了重新编码所有网站使用引导响应设计和插入页脚在索引.html. 以下HTML摘要：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="{% static 'css/styles.css' %}">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>
  {% block sidebar %}<!  insert default navigation text for every page  >{% endblock %}
  {% block content %}<!  default content text (typically empty)  >
  <!  Main Logo  >
  <div class="main-image" id="myMainImage">
    <img src="{{STATIC_URL}}/static/images/logo.png"/>
  </div>
  <!  Navigation Bar  >
  <nav class="navbar navbar-inverse">
    ...
  </nav>
  <!  End of Navigation Bar  >

  <!  Articles  >
  <div class="articles" id="myArticles">
    {% for article in articles %}
    <h3>Titolo: {{ article.title }}</h3>
    <p><strong>Autori:</strong> {{ article.authors }}</p>
    <p><strong>Riepilogo:</strong> {{ article.summary }}</p>
    <p><strong>Testo:</strong> {{ article.content }}</p>
    {% endfor %}
  </div>
  <!  End of Articles  >

  <!  Footer  >
  <footer class="site-footer">
    <div id="footer1">
      <p> Text </p>
    </div>
  </footer>
  <!  End of Footer  >

  {% endblock %}
</body>
</html>

以及CSS：

^{pr2}$
网友
2楼 · 编辑于 2024-09-28 22:20:22

尝试在单独的页脚.html并使用include-template标记来包含html页面。在

相关问题 更多 >

    编程相关推荐