django 结合 bootstrap 使用
2017-02-21 08:20
399 查看
git clone https://github.com/dyve/django-bootstrap3.git[/code]
要运行demo,需要在demo 中为其增加一个符号链接 bootstrap3 到上层目录的同名文件夹sudo ln -s ../bootstrap3 ./bootstrap3
==================================================
直接使用bootstrap:
下载: http://getbootstrap.com/getting-started/#download
在 Django 项目的app目录下新建一个static文件夹,再在static里面新建一个bootstrap文件夹,将下载的三个文件夹放进去. 并修改 settings.py
关于static文件的使用,详细 settings.py 的 STATIC_URL 附近的注释网址,例如: https://docs.djangoproject.com/en/1.8/howto/static-files/STATIC_URL = '/static/' STATICFILES_DIRS = ( os.path.join(BASE_DIR, 'static'), )
将static目录放在 STATICFILES_DIRS 中,以便 load 到我们刚下载的bootstrap,bootstrap依赖于jQuery库,所以一定要添加,我们这里是直接引用的,如果有下载版本只需放在static里再引用就行。
使用时,在模板文件开头的 {% load staticfiles %}就是加载static目录,找到static目录,后续就可以使用相关bootstrap属性了<!DOCTYPE html> {% load staticfiles %} <html> <head lang="en"> <meta charset="UTF-8"> <!-- 引入jQuery --> <script src="http://apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- 引入 Bootstrap --> <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet" type="text/css"> <link href="{% static 'bootstrap/css/bootstrap.css' %}" rel="stylesheet" type="text/css"> <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.js' %}"></script> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> <![endif]--> <title>数据展示平台</title> </head> <body> <!-- bootstrap 特性容器 --> <div class="container"> <h1>Hello, world! </h1> </div> </body> </html>.
相关文章推荐
- 自定义分页标签结合spring mvc、bootstrap、mybatis、mysql的使用
- Django创建自定义filter来使用bootstrap
- 如何在Django1.8 结合Python3.4版本中使用MySql
- 将BootstrapJS和AngularJS结合使用以及为什么不用jQuery
- 将BootstrapJS和AngularJS结合使用以及为什么不用jQuery
- 结合使用 MongoDB 和 Django
- 使用Python的Django框架结合jQuery实现AJAX购物车页面
- Bootstrap 模态框、轮播 结合使用
- zTree 树形组件结合bootstrap的使用
- Bootstrap3 框架下 使用 Bootstrap-table 结合 Bootstrap- file input 上传文件 并显示进度条
- Tutorial: 结合使用AngularJS和Django
- 如何在Django1.6结合Python3.3版本中使用MySql
- rails4使用bootstrap的模态框插件,结合ajax做出从弹出框选取内容返回给原页面的效果
- BootstrapTable(附源码) Bootstrap结合BootstrapTable的使用,分为两种模试显示列表。
- 结合使用 MongoDB 和 Django
- django 结合bootstrap 的初探
- 如何在Django1.6结合Python3.4版本中使用MySql
- django 结合bootstrap 的初探
- angularjs之ui-bootstrap和ui-router结合使用
- scrapy一些非常实用资料整理,与其他mongdb、django、redis、solr、tor结合使用以及用Python脚本调用等等方法