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. C#计算两个时间的时间差，精确到年月日时分秒

    喏,计算两个时间的时间差,精确到年月日时分秒 看起来比较笨的方法了,不知道有没有改进 DateTime d1 = new DateTime(2016, 4, 1, 0, 0, 0); DateTime ...

  2. spark生态圈简介

    原文引自:http://www.cnblogs.com/shishanyuan/p/4700615.html 1.简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室(Algori ...

  3. Leetcode300. Longest Increasing Subsequence最长上升子序列

    给定一个无序的整数数组,找到其中最长上升子序列的长度. 示例: 输入: [10,9,2,5,3,7,101,18] 输出: 4 解释: 最长的上升子序列是 [2,3,7,101],它的长度是 4. 说 ...

  4. css3的2D变形

    一.2D变形 1.变形 transform:translate();translateX();translateY();translate(,); 2.过渡 transition:all 1s; 二. ...

  5. phpqrcode.php 生成二维码图片用于推广

    <?php /* * PHP QR Code encoder * * This file contains MERGED version of PHP QR Code library. * It ...

  6. 使用gRPC-Gateway快速构建微服务-双向认证下rpc-gateway使用（同时提供rpc和http接口）

    https://github.com/grpc-ecosystem/grpc-gateway 在grpc之上加一层代理并转发,转变成protobuf格式来访问grpc服务 安装 go get -u g ...

  7. JS中的一些函数式编程术语

    组合 Composition 组合某种类型(含函数)的两个元素,进而生成一个该类型的新元素:           JavaScript   1 2 3 4 5 6 7 let compose = (f ...

  8. Java中String类的常见面试题

    1. 判断定义为String类型的s1和s2是否相等 String s1 = "ab"; String s2 = "abc"; String s3 = s1 + ...

  9. windows2008解决必须使用角色管理工具安装或配置 NET3.5 sp1问题

    win2008系统安装网站环境系统的时候常常提示:必须使用角色管理工具 安装或配置microsoft.net framework 3.5 sp1 ,导致安装不成功. 原因在于windows2008系统 ...

  10. Python数据分析入门与实践

    Python数据分析入门与实践 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受,单论单个知识点课程本身没问题,大家看的时候可以关 ...