Django：如何在引导程序中将表单放在html模板上？

Question

我试图简单地将已在Django html模板上呈现的表单居中。 它是一个引导程序组件（窗体），我尝试将“ center” html标记放置在各个位置，但没有成功。 我尝试将center标签放在表单之外，Django模板语言块之外，以及基本模板中div之外。

在这种情况下，可以有人建议a）如何解决问题b）应用格式的最佳做法。

有人试图编辑它，暗示它与Django无关，但确实如此。 否则居中很简单，但是我想了解它使用基本模板和django的模板语言块的上下文。

page.html（扩展base2.html）

{% extends "socialmedia/base2.html" %}
{% load static %}
{% block title %}Welcome to the test page{% endblock %}
{% block heading %}Welcome,,,,{% endblock %}
<center>
{% block content1 %}
<class="form-group row">
    <label for="inputEmail3" class="col-sm-2 col-form-label">Email</label>
    <div class="col-sm-10">
      <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
    </div>
  </div>
  <div class="form-group row">
    <label for="inputPassword3" class="col-sm-2 col-form-label">Password</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
    </div>
  </div>
  <fieldset class="form-group">
    <div class="row">
      <legend class="col-form-label col-sm-2 pt-0">Radios</legend>
      <div class="col-sm-10">
        <div class="form-check">
          <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>
          <label class="form-check-label" for="gridRadios1">
            First radio
          </label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2">
          <label class="form-check-label" for="gridRadios2">
            Second radio
          </label>
        </div>
        <div class="form-check disabled">
          <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3" disabled>
          <label class="form-check-label" for="gridRadios3">
            Third disabled radio
          </label>
        </div>
      </div>
    </div>
  </fieldset>
  <div class="form-group row">
    <div class="col-sm-2">Checkbox</div>
    <div class="col-sm-10">
      <div class="form-check">
        <input class="form-check-input" type="checkbox" id="gridCheck1">
        <label class="form-check-label" for="gridCheck1">
          Example checkbox
        </label>
      </div>
    </div>
  </div>
  <div class="form-group row">
    <div class="col-sm-10">
      <button type="submit" class="btn btn-primary">Sign in</button>
    </div>
  </div>
</form>


{% endblock %}
</center>

base2.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="{% static 'worldguestbook\main2.css' %}"/>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <title>{% block title %}My amazing site{% endblock %}</title>
</head>

<body>
    <h1>{% block heading %}My amazing site{% endblock %}</h1>

    <div id="content1">
        {% block content1 %}{% endblock %}
    </div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</body>
</html>

Answer 1

尝试在下面的表单标签下使用

<form ALIGN='center'>
</form>

Django：如何在引导程序中将表单放在html模板上？

问题描述

1 个解决方案

解决方案1
1 已采纳 2019-05-29 11:23:17

Django：如何在引导程序中将表单放在html模板上？

问题描述

1 个解决方案

解决方案1 1 已采纳 2019-05-29 11:23:17

解决方案1
1 已采纳 2019-05-29 11:23:17