git clone https://github.com/dyve/django-bootstrap3.git

要运行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>
.

django 结合 bootstrap 使用的更多相关文章

  1. 整合django和bootstrap框架

    环境: python版本:2.7.8 django版本:1.7.1 bootstrap版本:3.3.0 首先github上面有两个开源的项目用来整合django和bootstrap. https:// ...

  2. Django 中bootstrap的引用

    bootstrap的优越性 如果你有基本的HTML+CSS,bootstrap其实就是在标签中加入具体的class来实现样式.和原生态的HTML+CSS需要先在head标签的style写样式或者引入外 ...

  3. Django配置Bootstrap, js

    1.首先在APP目录下创建一个static文件夹 如图: # Application definition INSTALLED_APPS = [ 'django.contrib.admin', 'dj ...

  4. Python - Django - 使用 Bootstrap 样式修改注册页

    reg2 函数: from django.shortcuts import render, HttpResponse from app01 import models def reg2(request ...

  5. django：bootstrap table加载django返回的数据

    bootstrap table加载表格数据有两类方式: 一种通过data属性的方式配置,一种是javascipt方式配置 这里看js配置方式: 1.当数据源为.json文件时 url参数写上json文 ...

  6. Django之Bootstrap使用

    首先将bootstrap文件粘贴到static文件夹中,引入分为两部分,一是css文件引入,二是js文件引入. 1.css引入: <!DOCTYPE html> <html lang ...

  7. django使用bootstrap快速美化 admin后台

    使用django-admin-bootstrappe快速美化后台 两步: 1.pip install django-admin-bootstrapped  安装应用 2.在setting.py里面添加 ...

  8. 【django】Bootstrap 安装和使用

    官网 下载:推荐下载源码包 安装Bower:使用Bower安装并管理 Bootstrap 的Less.CSS.JavaScript和字体文件(通过npm安装bower) npm install -g ...

  9. django使用bootstrap前端框架

    一.下载bootstrap相关文件,放在项目目录中.在blog 应用中新建static目录,bootstrap文件放在此目录下. bootstrap下载网址:http://v3.bootcss.com ...

随机推荐

  1. 01_Hibernate持久化

    一．简介 思考:为什么使用Hibernate? Hibernate对JDBC访问数据库的代码进行了封装. Hibernate是一个基于JDBC的主流持久化框架. Hibernate的性能比较好,它是一 ...

  2. 第一周课堂笔记2th

    上课笔记2th https://mubu.com/doc/2gxvIvVLG0(老师笔记网址) 1.     python python运行过程 把源代码转化成字节码(机器不能识别) 也可能不产生py ...

  3. elasticsearch 中文API 索引(三)

    索引API 索引API允许开发者索引类型化的JSON文档到一个特定的索引,使其可以被搜索. 生成JSON文档 有几种不同的方式生成JSON文档 利用byte[]或者作为一个String手动生成 利用一 ...

  4. Ubuntu下samba的安装和配置

    samba是Linux系统上的一种文件共享协议,可以实现Windows系统访问Linux系统上的共享资源,现在介绍一下如何在Ubuntu 14.04上安装和配置samba一. 一.更新源列表 打开&q ...

  5. Django项目：CRM(客户关系管理系统)--79--69PerfectCRM实现CRM业务流程(bpm)学生讲师分页

    # student_views.py # ————————60PerfectCRM实现CRM学生上课记录———————— from django.shortcuts import render #页面 ...

  6. mysql函数，语法

    转自:http://www.cnblogs.com/kissdodog/p/4168721.html MySQL数据库提供了很多函数包括: 数学函数: 字符串函数: 日期和时间函数: 条件判断函数: ...

  7. JS实现数据双向绑定

    本文参考https://www.cnblogs.com/tianhaining/p/8425345.html 首先先说个面试题哈,就是vue中的v-model是如何实现双向数据绑定的咳咳,下面开始背诵 ...

  8. 原声js实现nodejs中qs模块中的parse和stringfiy方法

    function stringify(obj, sep, eq) { sep = sep || '&'; eq = eq || '='; let str = ""; for ...

  9. MyISAM 与 innoDB 的选择

    1.MyISAM:默认表类型,它是基于传统的ISAM类型,ISAM是Indexed Sequential Access Method (有索引的顺序访问方法) 的缩写,它是存储记录和文件的标准方法.不 ...

  10. devc++读取不了当前目录下的文件

    devc++在当前目录新建了一个文件之后,用文件读取的操作报错:     如图所示:           解决方案: 先把该文件从左侧工作空间中移除:       移除之后就没了:         再 ...