【发布时间】:2021-12-26 09:33:39
【问题描述】:
我正在使用 Djanog 初学者书籍,它告诉我只需复制和粘贴,但是当我这样做时,它不起作用。功能正常(登录、注销等)只是这本书显示了网站正在更新并且看起来比我的要好。
这是我的 base.html 文件:
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81i
uXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<title>{% block title %}Newspaper App{% endblock title %}</title>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4">
<a class="navbar-brand" href="{% url 'home' %}">Newspaper</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarCollapse" aria-controls="navbarCollapse"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
{% if user.is_authenticated %}
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link dropdown-toggle" href="#" id="userMenu"
data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
{{ user.username }}
</a>
<div class="dropdown-menu dropdown-menu-right"
aria-labelledby="userMenu">
<a class="dropdown-item"
href="{% url 'password_change'%}">Change password</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="{% url 'logout' %}">
Log Out</a>
</div>
</li>
</ul>
{% else %}
<form class="form-inline ml-auto">
<a href="{% url 'login' %}" class="btn btn-outline-secondary">
Log In</a>
<a href="{% url 'signup' %}" class="btn btn-primary ml-2">
Sign up</a>
</form>
{% endif %}
</div>
</nav>
<div class="container">
{% block content %}
{% endblock content %}
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4\
YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAKl8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>
其他 HTML 文件:
Signup.html:
{% extends 'base.html' %}
{% block title %}Sign Up{% endblock title %}
{% block content %}
<h2>Sign Up</h2>
<form method="post">
{% csrf_token %}
{{ form.as_p }}
<button type="submit">Sign Up</button>
</form>
{% endblock content %}
home.html:
{% extends 'base.html' %}
{% block title %}Home{% endblock title %}
{% block content %}
{% if user.is_authenticated %}
Wassup {{ user.username }}!
<p><a href="{% url 'logout' %}">Log Out</a></p>
{% else %}
<p>You Are Not Logged In MAN</p>
<a href="{% url 'login' %}">Log In</a> |
<a href="{% url 'signup' %}">Sign Up</a>
{% endif %}
{% endblock content %}
login.html:
{% extends 'base.html' %}
{% block title %}Log In{% endblock title %}
{% block content %}
<h2>Log In</h2>
<form method="post">
{% csrf_token %}
{{ form.as_p }}
<button type="submit">Log In</button>
</form>
{% endblock content %}
注意:login.html 位于另一个名为“registration”的目录中,该目录位于我的模板目录中。
这本书甚至没有告诉我下载 Bootstrap(即使我是初学者,我也觉得我应该下载 Bootstrap 才能使用它)。如果有人知道问题是什么,请帮忙。
【问题讨论】:
-
不,不需要下载引导程序,您可以通过 CDN 使用它。哪个文件看起来不好 base.html 或其他文件?您的引导 CDN 存在问题,您的 CDN 中有一个
\(反斜杠)删除它可以工作 -
我不是 100% 知道哪个文件有问题,尽管我很确定它是 base.html 文件,因为我没有更改任何其他内容(关于引导程序的主题)。你能指出我的代码中的“\”在哪里吗?我好像没找到。
-
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/\ bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81i\ uXoPkFOJwJ8ERdknLPMO">这个有问题,这个是正确的<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/ bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81i uXoPkFOJwJ8ERdknLPMO">用这个替换CDN -
如果你扩展你的 base.html 比你必须使用 django teamplate
{% block body %}参考这个文档以获得更多信息。 docs.djangoproject.com/en/3.2/ref/templates/language/#templates -
就像我说的那样,我只是复制并粘贴了代码,所以我不确定是否有任何问题。如果扩展我的 base.html 文件意味着另一个 HTML 文件具有标签 {% extends 'base.html' %},那么我应该将 {% block body %} 放在我的 base.html 文件的顶部?