BootStrap扔进Django里的方法详解


Posted in Javascript onMay 13, 2016

因为django的版本差异化比较大,所以以下配置仅供学习参考。

D:\www\mysite>python --version
Python 2.7.5
>>> print django.__version__
1.9.4

本记录不作细说,主要配置过程如下:

1.settings.py最后一段,关于静态文件的配置

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.9/howto/static-files/
SITE_ROOT = os.path.join(os.path.abspath(os.path.dirname(__file__)), '..')
STATIC_ROOT = os.path.join(SITE_ROOT, 'static')
STATIC_URL = '/static/'
STATICFILES_DIRS = (
("css", os.path.join(STATIC_ROOT, 'css')),
("js", os.path.join(STATIC_ROOT, 'js')),
("images", os.path.join(STATIC_ROOT, 'images')),
("bower_components", os.path.join(STATIC_ROOT, 'bower_components')),
)

2.urls.py 关于路由的配置

urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$', views.index),
url(r'^home/', views.home),
]

3.views.py 视图设计,简单得不能再简单的那种。

def home(request):
return render_to_response('home/login.html')

4.模板调用 home/login.html 页面对于静态文件css, js,以及图片等调用。

<!-- Bootstrap Core CSS -->
<link href="/static/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="/static/css/sb-admin-2.css" rel="stylesheet">
<img src="/static/images/xjlxprocess.png" />

5.最后,我的目录结构,就如网上其它文章所描述的那样。

website
---------static 
---------|-----css 
---------|-----js 
---------|-----images 
---------|-----bower_components 
---------templates 
---------|-----home
---------|-----------login.html
---------|-----admin
---------website

6.站点打开如下:

BootStrap扔进Django里的方法详解

以上内容是小编给大家介绍的BootStrap扔进Django里的方法详解,希望对大家有所帮助,如果大家想了解更多资讯敬请关注三水点靠木网站!

Javascript 相关文章推荐
javascript基础的动画教程,直观易懂
Jan 10 Javascript
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
Feb 02 Javascript
jQuery简单几行代码实现tab切换
Mar 10 Javascript
JavaScript调用客户端Java程序的方法
Jul 27 Javascript
JavaScript简单实现鼠标移动切换图片的方法
Feb 23 Javascript
分享JavaScript监听全部Ajax请求事件的方法
Aug 28 Javascript
jQuery制作input提示内容(兼容IE8以上)
Jul 05 jQuery
打造通用的匀速运动框架(实例讲解)
Oct 17 Javascript
vue 项目如何引入微信sdk接口的方法
Dec 18 Javascript
vue.js指令v-for使用以及下标索引的获取
Jan 31 Javascript
vue中使用vue-cli接入融云实现即时通信
Apr 19 Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 Javascript
JavaScript重载函数实例剖析
May 13 #Javascript
JS加载iFrame出现空白问题的解决办法
May 13 #Javascript
基于JS判断iframe是否加载成功的方法(多种浏览器)
May 13 #Javascript
JS iFrame加载慢怎么解决
May 13 #Javascript
基于JS实现的笛卡尔乘积之商品发布
May 13 #Javascript
基于jQuery倒计时插件实现团购秒杀效果
May 13 #Javascript
js获取鼠标点击的对象,点击另一个按钮删除该对象的实现代码
May 13 #Javascript
You might like
php中的静态变量的基本用法
2014/03/20 PHP
教你在header中隐藏php的版本信息
2016/08/10 PHP
使用PHPExcel实现数据批量导出为excel表格的方法(必看)
2017/06/09 PHP
Git命令之分支详解
2021/03/02 PHP
alixixi runcode.asp的代码不错的应用
2007/08/08 Javascript
js中cookie的添加、取值、删除示例代码
2013/10/21 Javascript
提取字符串中年月日的函数代码
2013/11/05 Javascript
百度地图自定义控件分享
2015/03/04 Javascript
jQuery使用post方法提交数据实例
2015/03/25 Javascript
Javascript中的包装类型介绍
2015/04/02 Javascript
js实现的后台左侧管理菜单代码
2015/09/11 Javascript
深入理解jQuery中的事件冒泡
2016/05/24 Javascript
Javascript实现前端简单的路由实例
2016/09/11 Javascript
jQuery实现select下拉框获取当前选中文本、值、索引
2017/05/08 jQuery
浅谈vue2 单页面如何设置网页title
2017/11/08 Javascript
原生JS进行前后端同构
2018/04/22 Javascript
优雅的处理vue项目异常实战记录
2019/06/05 Javascript
Layui tree 下拉菜单树的实例代码
2019/09/21 Javascript
javascript利用键盘控制小方块的移动
2020/04/20 Javascript
Vue3新特性之在Composition API中使用CSS Modules
2020/07/13 Javascript
jQuery实现带进度条的轮播图
2020/09/13 jQuery
利用Python和OpenCV库将URL转换为OpenCV格式的方法
2015/03/27 Python
Python实现将SQLite中的数据直接输出为CVS的方法示例
2017/07/13 Python
PyQt5每天必学之QSplitter实现窗口分隔
2018/04/19 Python
pyqt5 comboBox获得下标、文本和事件选中函数的方法
2019/06/14 Python
python求质数列表的例子
2019/11/24 Python
Python 调用有道翻译接口实现翻译
2020/03/02 Python
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
美国高品质个性化珠宝销售网站:Jewlr
2018/05/03 全球购物
小区门卫岗位职责
2013/12/31 职场文书
文明城市创建标语
2014/06/16 职场文书
会计学毕业生求职信
2014/06/25 职场文书
工作粗心大意检讨书
2014/09/18 职场文书
警察群众路线对照检查材料思想汇报
2014/10/01 职场文书
2014年秘书工作总结
2014/11/25 职场文书
详细了解java监听器和过滤器
2021/07/09 Java/Android