带有Bootstrap的Django

Bootstrap是一个框架, 用于在Web应用程序中创建用户界面。它提供css, js和其他工具来帮助创建所需的界面。
【带有Bootstrap的Django】在Django中, 我们可以使用引导程序来创建更多用户友好的应用程序。
要实现引导, 我们需要遵循以下步骤。
1.下载引导程序
访问官方网站https://getbootstrap.com以在本地计算机上下载引导程序。这是一个zip文件, 将其解压缩并看到它包含两个文件夹。

带有Bootstrap的Django

文章图片

在此模板中, 我们链接两个文件, 一个是bootstrap.min.css, 另一个是bootstrap.min.js。让我们看看如何在应用程序中使用它们。
假设, 如果我们不使用引导程序, 则我们的html登录看起来像这样:
< !DOCTYPE html> < html lang="en"> < head> < meta charset="UTF-8"> < title> login< /title> < /head> < body> < form action="/save" method="post"> < div class="form-group"> < label for="email"> Email address:< /label> < input type="email" class="form-control" id="email"> < /div> < div class="form-group"> < label for="pwd"> Password:< /label> < input type="password" class="form-control" id="pwd"> < /div> < div class="checkbox"> < label> < input type="checkbox"> Remember me< /label> < /div> < button type="submit" class="btn btn-primary"> Submit< /button> < /form> < /body> < /html>

输出:
带有Bootstrap的Django

文章图片

输出:
带有Bootstrap的Django 现在, 我们的登录表单好多了。这是引导的优势。
最后, 项目结构看起来像这样。
带有Bootstrap的Django

    推荐阅读