Django使用 Bootstrap 样式修改书籍列表过程解析

这篇文章主要介绍了Django使用 Bootstrap 样式修改书籍列表过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

展示书籍列表:

首先修改原先的 book_list.html 的代码:

   书籍列表管理 

书籍管理页面

书籍列表
{% for book in book_list %} {% endfor %}
#id书名出版社名称操作
{{ forloop.counter }}{{ book.id }}{{ book.title }}{{ book.publisher.name }} 删除编辑

修改过程:

运行效果:

添加书籍:

再来修改 add_book.html

   添加书籍 
添加书籍

修改过程:

先写一个 container

找一个面板,在 Bootstrap 的组件中可找到

复制代码,并进行修改

现在需要一个 form 表单,在 Bootstrap 的全局 CSS 样式中找

复制下面的代码,替换面板代码中的 Panel content,并进行修改

先修改 email 处

 

修改为:

 

再来修改 password 处,这里需要用到下拉列表,还是去 Bootstrap 上找

在 “菜单” -> "被支持的控件" 处

复制代码,并进行修改

 

修改为:

 

接着修改剩下的部分

最后在 form 表单处添加 action 和 method

运行效果:

编辑书籍:

最后修改 edit_book.html

   编辑书籍 
编辑书籍

修改过程:

首先把 add_book.html 复制过去,然后修改相关标题,把 “添加书籍” 改为 “编辑书籍”

然后在 form 表单下一行添加一个有书籍 id 的 input 标签

然后在书名的那个 input 处添加一个 value

然后将下拉列表的出版社选择改为原 edit_book.html 的

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持html中文网。

以上就是Django使用 Bootstrap 样式修改书籍列表过程解析的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » python