Django 3使用引导程序时出现问题

Question

我正在尝试实现引导，并认为this library看起来非常整洁。然而，当我尝试使用其中一个模板标记时，没有样式，只有一个普通的ol'HTML表单。我已经做过的事情：

• 已将'bootstrap3',添加到我的settings.py
• 在模板顶部加载了库

这是我的模板：

{% extends 'base.html' %}
{% load bootstrap3 %}
{% bootstrap_messages %}

{% block title %}
    Edit {{ thing.name }} - {{ block.super }}
{% endblock title %}

{% block content %}
    <h1>Edit "{{ thing.name }}"</h1>
    <form role="form" action="" method="post">
       {% csrf_token %}
       {% bootstrap_form form %}
       {% buttons %}
       <button type="submit">{% bootstrap_icon "star" %}Submit</button>
    </form>
       {% endbuttons %}

{% endblock content %}

为了记录在案-settings.py：

INSTALLED_APPS = [
    'collection',
    'bootstrap3',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'django.contrib.sitemaps',
    'registration',

]

非常感谢您的帮助！你知道吗

Answer 1

我设法解决了自己的问题。@乔什凯利的回答是解决方案的一部分。我刚刚在我的{% block %}内容中加载了CSS和Javascript。像这样：

{% extends 'base.html' %}

{% load bootstrap3 %}


{% block title %}
    Edit {{ thing.name }} - {{ block.super }}
{% endblock title %}

{% block content %}
{% bootstrap_css %}
{% bootstrap_javascript %}
    <h1>Edit "{{ thing.name }}"</h1>
    <form role="form" action="" method="post">
       {% csrf_token %}
       {% bootstrap_form form %}
       {% buttons %}
       <button type="submit">{% bootstrap_icon "star" %}Submit</button>
    </form>
       {% endbuttons %}

{% endblock content %}

正如乔希提到的，这看起来不太漂亮，所以我会确保把它添加到我的基本.html. 你知道吗

Answer 2

如果事情基本正常，但是缺少样式，很可能是因为您没有使用引导CSS。django-bootstrap3的自述文件省略了这一点，但是它的quickstart example template有必要的细节。你知道吗

{# Load the tag library #}
{% load bootstrap3 %}

{# Load CSS and JavaScript #}
{% bootstrap_css %}
{% bootstrap_javascript %}

{# Display django.contrib.messages as Bootstrap alerts #}
{% bootstrap_messages %}

{# Display a form #}
<form action="/url/to/submit/" method="post" class="form">
  {% csrf_token %}
  {% bootstrap_form form %}
  {% buttons %}
    <button type="submit" class="btn btn-primary">
      {% bootstrap_icon "star" %} Submit
    </button>
  {% endbuttons %}
</form>

（当然，对于一个真正的站点，您可能需要将{% bootstrap_css %}和{% bootstrap_javascript %}添加到基本模板中。）