用Django全栈开发——06. 为前端引入Bootstrap框架

大家好，这是皮爷给大家带来的最新的学习Python能干啥？之Django教程，从零开始，到最后成功部署上线的项目。

上一篇文章，我们使用Gulp来搭建好我们前端开发的环境工程，那么这一篇，我们来说，如何在Django中集成Bootstrap。

环境准备

首页的编写，当然是HTML，CSS还有JavaScript的代码编写。如果不是专门搞前端的同学，在面对这几个东西混杂在一起的时候，心情是十分复杂的，因为他们这几个东西，虽然好入门，但是写起来其实很复杂，如果想要写好，写的高明，那更是得需要花费一大番功夫才能做得到，我在面对这几个东西的时候，我也是这种感受，但是，别怕，我为大家躺雷了。

首先，

我们在前端使用的CSS库为最新的Bootstrap 4.

官网地址：https://getbootstrap.com/
文档地址：https://getbootstrap.com/docs/4.3/getting-started/introduction/

根据官方文档里面的介绍，引入方法很简单，一种是直接在页面的Html的Header中加入引用资源路径；另一种也可以将源码下载下来，导入到工程中。

这里，我们为了方便省事儿，就按照第一种方式来做。

其次，

我们可以去Bootstrap的官网例子页面，去随便找一个例子。

官方用例地址：https://getbootstrap.com/docs/4.3/examples/

然后我们就挑选这个Album的例子：

在线地址为：https://getbootstrap.com/docs/4.3/examples/album/

其实扣代码很简单，我们打开用例的网页，在任意位置点击右