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 相关文章推荐
jquery实现的超出屏幕时把固定层变为定位层的代码
Feb 23 Javascript
javascript通过navigator.userAgent识别各种浏览器
Oct 25 Javascript
jQuery中:not选择器用法实例
Dec 30 Javascript
Jquery Ajax xmlhttp请求成功问题
Feb 04 Javascript
使用UrlConnection实现后台模拟http请求的简单实例
Jan 04 Javascript
JS实现的Unicode编码转换操作示例
Apr 28 Javascript
基于require.js的使用(实例讲解)
Sep 07 Javascript
bootstrap table实现合并单元格效果
Dec 24 Javascript
JS Generator 函数的含义与用法实例总结
Apr 08 Javascript
Element Input输入框的使用方法
Jul 26 Javascript
vite+vue3.0+ts+element-plus快速搭建项目的实现
Jun 24 Vue.js
Vue自定义铃声提示音组件的实现
Jan 22 Vue.js
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安装全攻略:APACHE
2006/10/09 PHP
用php写的serv-u的web申请账号的程序
2006/10/09 PHP
php函数的常用方法及注意之处小结
2011/07/10 PHP
深入php var_dump()函数的详解
2013/06/05 PHP
php中使用in_array() foreach array_search() 查找数组是否包含时的性能对比
2015/04/14 PHP
php parse_str() 函数的定义和用法
2016/05/23 PHP
浅谈laravel框架sql中groupBy之后排序的问题
2019/10/17 PHP
PHP Swoole异步MySQL客户端实现方法示例
2019/10/24 PHP
js实现右下角提示框的方法
2015/02/03 Javascript
基于JavaScript实现移除(删除)数组中指定元素
2016/01/04 Javascript
jquery仿苹果的时间/日期选择效果
2017/03/08 Javascript
javascript中的面向对象
2017/03/30 Javascript
详解如何将angular-ui的图片轮播组件封装成一个指令
2017/05/09 Javascript
Angular.js实现获取验证码倒计时60秒按钮的简单方法
2017/10/18 Javascript
PHP实现基于Redis的MessageQueue队列封装操作示例
2019/02/02 Javascript
vue生命周期与钩子函数简单示例
2019/03/13 Javascript
微信小程序Echarts图表组件使用方法详解
2019/06/25 Javascript
vue中注册自定义的全局js方法
2019/11/15 Javascript
Python中最大最小赋值小技巧(分享)
2017/12/23 Python
在Python中实现shuffle给列表洗牌
2018/11/08 Python
python感知机实现代码
2019/01/18 Python
python输出带颜色字体实例方法
2019/09/01 Python
使用apiDoc实现python接口文档编写
2019/11/19 Python
基于Python批量生成指定尺寸缩略图代码实例
2019/11/20 Python
python numpy库np.percentile用法说明
2020/06/08 Python
童装店创业计划书
2014/01/09 职场文书
预备党员思想汇报范文
2014/01/11 职场文书
高二英语教学反思
2014/01/19 职场文书
渔夫的故事教学反思
2014/02/14 职场文书
平安校园建设方案
2014/05/02 职场文书
投标承诺书怎么写
2014/05/24 职场文书
2014年图书馆工作总结
2014/11/25 职场文书
2014年党务工作总结
2014/11/25 职场文书
幼儿园中班教师个人工作总结
2015/02/06 职场文书
导游词之永济鹳雀楼
2020/01/16 职场文书
FP-growth算法发现频繁项集——构建FP树
2021/06/24 Python