Django配置Bootstrap, js实现过程详解


Posted in Python onOctober 13, 2020

1、首先在APP目录下创建一个static文件夹

如图:

Django配置Bootstrap, js实现过程详解

# Application definition

INSTALLED_APPS = [
  'django.contrib.admin',
  'django.contrib.auth',
  'django.contrib.contenttypes',
  'django.contrib.sessions',
  'django.contrib.messages',
  'django.contrib.staticfiles',
  'appBook.apps.AppbookConfig',
  
]

2、在settings.py中 最底部添加如下:

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

STATIC_URL = '/static/'
STATIC_ROOT=(
  os.path.join(BASE_DIR,"appBook/static"),
)

3、在html页面头部添加:

Django配置Bootstrap, js实现过程详解

{% load staticfiles %}

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.css' %}" rel="external nofollow" >
  <style>
    .container{
      margin-top: 80px;
    }
  </style>
</head>
<body>

4、在html模版页面,可以用如下方式调用:

<img src="{% static 'images/logo.gif' %}" alt=""/> 
<img src="/static/images/acer.gif" alt=""/> 
推荐使用第二种,因为如果图片名称是动态的,可以通过views这么绑定: 
<img src="/static/images/{{name}}.gif" alt=""/> css的引用同样如此: <link rel="stylesheet" href="{% static ‘style/base.css' %}" rel="external nofollow" type="text/css"> <link rel="stylesheet" href="/static/style/base.css" rel="external nofollow" type="text/css"> js的引用同样如此: <script type="text/javascript" src="{% static ‘js/jquery-1.8.3.min.js' %}"/> <script type="text/javascript" src="/static/js/jquery-1.8.3.min.js"/>
可以用 python manage.py findstatic css/index.css 寻找 css

Django:locals()小技巧

locals()返回一个包含当前作用域里面的所有变量和它们的值的字典。

所以可以把views改写为

def current_datetime(request):
  current_date = datetime.datetime.now()
  return render_to_response('current_datetime.html', locals())

这里要注意的是要把now重命名为current_date,因为模板需要的是这个变量名。

在template是如下定义的:

<html>
  <body>
    <font color = "blue">It is is now {{ current_date }}.</font>
  </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
Python统计列表中的重复项出现的次数的方法
Aug 18 Python
Python中让MySQL查询结果返回字典类型的方法
Aug 22 Python
python 分离文件名和路径以及分离文件名和后缀的方法
Oct 21 Python
python实现文本界面网络聊天室
Dec 12 Python
Python正则匹配判断手机号是否合法的方法
Dec 09 Python
在python tkinter中Canvas实现进度条显示的方法
Jun 14 Python
解决Python pip 自动更新升级失败的问题
Feb 21 Python
Django实现将一个字典传到前端显示出来
Apr 03 Python
基于python实现数组格式参数加密计算
Apr 21 Python
python删除指定列或多列单个或多个内容实例
Jun 28 Python
Python连接Postgres/Mysql/Mongo数据库基本操作大全
Jun 29 Python
分析Python list操作为什么会错误
Nov 17 Python
Python文件操作及内置函数flush原理解析
Oct 13 #Python
Django如何实现防止XSS攻击
Oct 13 #Python
5款实用的python 工具推荐
Oct 13 #Python
Python内置函数及功能简介汇总
Oct 13 #Python
Python pymysql模块安装并操作过程解析
Oct 13 #Python
Python安装并操作redis实现流程详解
Oct 13 #Python
python按照list中字典的某key去重的示例代码
Oct 13 #Python
You might like
ThinkPHP查询返回简单字段数组的方法
2014/08/25 PHP
CodeIgniter框架基本增删改查操作示例
2017/03/23 PHP
获取当前网页document.url location.href区别总结
2008/05/10 Javascript
一些mootools的学习资源
2010/02/07 Javascript
jquery autocomplete自动完成插件的的使用方法
2010/08/07 Javascript
url地址自动加#号问题说明
2010/08/21 Javascript
jquery 插件学习(三)
2012/08/06 Javascript
js 实现在离开页面时提醒未保存的信息(减少用户重复操作)
2013/01/16 Javascript
JavaScript中使用typeof运算符需要注意的几个坑
2014/11/08 Javascript
Javascript数组Array方法解读
2016/03/13 Javascript
jquery中validate与form插件提交的方式小结
2016/03/26 Javascript
JavaScript中Array的实用操作技巧分享
2016/09/11 Javascript
NodeJS中的MongoDB快速入门详细教程
2016/11/11 NodeJs
利用D3.js实现最简单的柱状图示例代码
2016/12/09 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
2017/01/18 Javascript
推荐15个最好用的JavaScript代码压缩工具
2019/02/13 Javascript
微信小程序基于picker实现级联菜单
2019/02/15 Javascript
Python单元测试框架unittest使用方法讲解
2015/04/13 Python
python tensorflow基于cnn实现手写数字识别
2018/01/01 Python
代码讲解Python对Windows服务进行监控
2018/02/11 Python
Python基于Flask框架配置依赖包信息的项目迁移部署
2018/03/02 Python
Python开发的十个小贴士和技巧及长常犯错误
2018/09/27 Python
Python常见数字运算操作实例小结
2019/03/22 Python
django 快速启动数据库客户端程序的方法示例
2019/08/16 Python
Python如何使用字符打印照片
2020/01/03 Python
Django之choices选项和富文本编辑器的使用详解
2020/04/01 Python
html5手机键盘弹出收起的处理
2020/01/20 HTML / CSS
html5中使用hotcss.js实现手机端自适配的方法
2020/04/23 HTML / CSS
canvas画图被放大且模糊的解决方法
2020/08/11 HTML / CSS
Stubhub英国:购买体育、演唱会和剧院门票
2018/06/10 全球购物
Footshop罗马尼亚:最好的运动鞋选择
2019/09/10 全球购物
机电系毕业生求职信
2014/07/11 职场文书
机关干部正风肃纪心得体会
2016/01/15 职场文书
导游词书写之黄山
2019/08/06 职场文书
Flutter集成高德地图并添加自定义Maker的实践
2022/04/07 Java/Android
Oracle中日期的使用方法实例
2022/07/07 Oracle