Django 中bootstrap的引用
bootstrap的优越性
如果你有基本的HTML+CSS,bootstrap其实就是在标签中加入具体的class来实现样式。和原生态的HTML+CSS需要先在head标签的style写样式或者引入外部样式相比,bootstrap相当于已经写好了,直接用对应的class引用就可以了。
bootstrap的使用
我是在用Django开发的过程中用bootstrap。
1. bootstrap的引用
我使用的bootstrap3,在Django中,引入静态文件非常的简单:
- Django的设置
在settings中定义STATIC_URL、STATICFILES_DIRS。默认Django会在每个app下的static/app查找静态文件,如果加额外的路径寻找则在STATICFILES_DIR中设置(我常用这个,因为项目共用bootstrap),此外,Django还有个STATIC_ROOT,是使用collectstatic命令收集静态文件的作用。
Django官方文档
写好后,将下载的bootstrap的文件夹拷到项目(注意不是app下)的static路径下
注意:生产版本的bootstrap是没有jquery.min.js的(如果有响应效果,需要加这个),所以需要自己下载
引用的时候,可以像官网说的那样:
href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
或者,使用静态导入(记得在开头加上{% load staticfiles %}。如果有extends语句,load放在extends下),然后导入:
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'css/bootstrap-theme.min.css' %}">
<link rel="stylesheet" href="{% static 'css/mycss.css' %}"
2. 在templates中使用
比如你需要一个navbar,也就是导航条,去bootstrap中组件,找到导航条,复制代码即可。然后修改成自己的样式即可。
Django 中bootstrap的引用的更多相关文章
- Django中静态文件引用优化
静态文件引用优化 在html文件中是用django的静态文件路径时,一般会这么写: <script type="text/javascript" src="/sta ...
- Django中使用静态资源/文件
Django中常需要引用js,css,小图像文件,一般我们把这一类文件称为静态文件,放置在static文件夹中,接下来,对Django中配置静态文件进行下傻瓜式的步骤介绍 在工程目录下新建static ...
- Django中使用Bootstrap
一.在Django中引用Bootstrap模版 1.首先下载bootsrtap代码(http://v3.bootcss.com/getting-started/#download),并将下载后的文件放 ...
- bootstrap 在django中的使用
一.应用 http://www.bootcss.com/进入bootstrap4或bootstrap3中文网,想要快速地将 Bootstrap 应用到你的项目中,有以下两种办法: 1.boot ...
- (day69)axios、配置ElementUI、配置jQuery和Bootstrap、Django中的CORS问题
目录 一.Vue的ajax插件:axios 二.Django中的CORS跨域问题 (一)同源策略 (二)解决方式(cors模块) 三.Vue配置ElementUI 四.Vue配置jQuery和Boot ...
- Django中使用bookstarp框架(4)
Django中使用bookstarp框架(4) 注意:要使用bookstarp框架前,要先有css的基础 因为主要是研究后台的使用方法,就引入前端的框架,简化html上的耗时(主要是不想把时间浪费在前 ...
- Django中使用Bootstrap----带view.py视图函数(也就是项目下的脚本文件)
一.Django中使用Bootstrap 1.首先建立工程,建立工程请参照:https://www.cnblogs.com/effortsing/p/10394511.html 2.在Firstdja ...
- django中的静态文件
静态文件 1.什么是静态文件 在django中静态文件是指那些图片.css样式.js样式.视频.音频等静态资源. 2.为什么要配置静态文件 这些静态文件往往不需要频繁的进行变动,如果我们将这些静态文件 ...
- Django中csrf错误
CSRF(Cross-site request forgery)跨站请求伪造,也被称为“one click attack”或者session riding,通常缩写为CSRF或者XSRF,是一种对网站 ...
随机推荐
- RedHat Linux关闭seLinux命令
Redhat使用了SELinux来增强安全,关闭的办法为: 1. 永久有效 修改 /etc/selinux/config 文件中的 SELINUX="" 为 disabled ,然 ...
- 疯狂Workflow讲义——基于Activiti的工作流应用开 PDF 下载
<疯狂Workflow讲义--基于Activiti的工作流应用开> 一:文档获取下载方式: 1:花20CSDN积分:可以下载:http://download.csdn.net/downlo ...
- 尚硅谷《全套Java、Android、HTML5前端视频》
尚硅谷<全套Java.Android.HTML5前端视频> (百万谷粉推荐:史上最牛.最适合自学的全套视频.资料及源码) [尚硅谷官网资料导航] 谷粒学院在线学习:http://www.g ...
- CF1019C
好玄学的东西... 核心思想:for循环! 首先,我们从前向后扫所有的点,如果这个点没被标记成不可用就把这个点标记成已使用,然后把所有与这个点直接相连的点标记成不可用 接下来,我们从后向前扫所有的点, ...
- Linux文本分析命令awk的妙用
基本用法 awk是一个强大的文本分析工具,简单来说awk就是把文件逐行读入,(空格,制表符)为默认分隔符将每行切片,切开的部分再进行各种分析处理 awk命令格式如下 awk [-F field-sep ...
- js--基础(对象、数组、函数、if语句、while语句、do while语句、continue语句、break语句)
三.流程控制:1.单行语句var age =20;//单行语句 2.复合语句花括号包含起来的与聚集和叫做复合语句,一对花括号表示一个复合语句 ,处理时可以当成一个单行语句来看待,一般复合句与叫做代码块 ...
- Mysql 查看连接数,状态 最大并发数
show status like '%max_connections%'; ##mysql最大连接数set global max_connections=1000 ##重新设置show variabl ...
- Jmeter3.0 中文乱码的解决方法
在Body Data中输入中文时,发现是乱码,如下图 这种情况在jmeter3.0的版本中才会产生,由于3.0中优化body data后,使用默认的字体(Consolas)不支持汉字的显示. 解决方法 ...
- 使用vue-cli 引入bootstrap.min.css文件报错
可以在index.html 里面引入boostrap.min.css文件 将bootstrap.min.css文件放置于static/css/文件夹中 然后再index.html文件中引入便可 < ...
- Java+selenium之WebDriver对浏览器的简单操作(一)
操作浏览器的主要方法都来自 org.openqa.selenium.WebDriver 这个接口 这些方法都是在 org.openqa.selenium.remote.RemoteWebDriver这 ...