Django配置静态文件(CSS\js)及Django调用JS、CSS、图片等静态文件
1 新建一项目:
root@python:django-admin.py startproject csstest
root@python:cd csstest
root@python:ls
csstest(__init__.py settings.py urls.py wsgi.py) manage.py
注:使用命令新建一项目文件,进入该项目,显示一个与项目同名的文件夹(此文件夹包含4个文件,如上所示)和一个管理python格式的文件。
2 新建一应用:
root@python:adjango-admin.py startapp myapp
root@python:ls
myapp(__init__.py models.py tests.py views.py) csstest(__init__.py settings.py urls.py wsgi.py) manage.py
注:1,此命令及下面的所有命令,都是在1步骤后的当前目录,即项目目录;
2,此步使用命令新建一应用,显示后,比1多出一个应用文件夹(此文件夹内包含4个文件,如上所示)。
3 新建模块文件夹
root@python:mkdir static templates
注:新建一模板文件夹,用来存放模板文件,如html格式的文件。
4 新建静态文件文件夹
root@python:mkdir myapp/static
注:在应用下新建一文件夹(最好命名为static),用来存放含有css,js或图片的文件。
5 添加测试代码
(1)root@python:vim csstest/urls.py
只添加:url(r'^$',include('myapp.urls')),
(2)root@python:vim myapp/urls.py
from django.ocnf.urls import *
from django.conf import settings
ulrpatterns = patterns('',
url('^','myapp.views.index'),
url('^static/(?P<path>.*)$','django.views.static.serve',{'document_root':settings.STATIC_ROOT},name='static'),
)
(3)root@python:vim myapp/views.py
from django.shortcuts import render_to_response
def index(req):
return render_to_response('indexl.html')
(4)root@python:vim templates/index.py
<html>
<link href="/static/style.css" ref="stylesheet" type="text/css" />
<head>
<title> my index </title>
</head>
<body>
<h1> my first Django web </h1>
<div>
<div> my first div </div>
<div> my second div </div>
</div>
</body>
</html>
(5)root@python:vim myapp/static/style.css
body {background-color:red;}
注:1,此过程是安装Django的运行过程添加的代码,即当我们在浏览器中输入:127.0.0.1:8000后,系统首先运行csstest/urls.py,找到匹配的url后,接着进入myapp/urls.py,找到最终的视图文件,响应myapp/views.py,在该视图文件中,去返回templates/index.html的文件,由于该文件用到了静态文件css,所以在myapp/static/下添加文件style.css。
2,逆过来说,首先要配置,在csstest/settings.py下配置STATIC_ROOT、STATIC_URL、TEMPLATE_DIRS、INSTALLED_APPS;
其次, url('^static/(?P<path>.*)$','django.views.static.serve',{'document_root':settings.STATIC_ROOT},name='static'),
再次,<link href="/static/style.css" ref="stylesheet" type="text/css" />,这里的红包static最好相对应,如可以命名为site_static等。
6 配置
root@python:vim csstest/settings.py
STATIC_ROOT= os.path.join(os.path.dirname(os.path.dirname(__file__)),'static').replace('\\','/')
STATIC_URL = '/static/'
TEMPLATE_DIRS(
'/home/django/csstest/templates',
)
INSTALLED_APPS(
.......
'myapp',
)
7 显示效果:
即添加红色的背景(第5步的(5))
Django配置静态文件(CSS\js)及Django调用JS、CSS、图片等静态文件的更多相关文章
- python-execjs(调用js)
一.安装 pip3 install PyExecJS 电脑上要有nodejs环境 二.使用 一.获取js字符串 首先将js保存至于本地文件或者你可以可以直接读到内存,必须让js以字符串的形式展示 注意 ...
- 文件正在上传的转圈圈gif图片引出的fixed定位和absolute定位
文件正在上传的转圈圈gif图片 一.文件上传时,未上传返回成功状态之前给个gif动态图片显示在页面,改善用户体验. <!--S 遮罩层 --> <div id="mas ...
- JS调用App方法及App调用JS方法
做App内嵌H5项目时,经常会遇到js与App的交互,最普遍的就是方法的互相调用,那么如何实现方法的互相调用呢? 写在前面: 如果只是小项目且后期扩大的可能性不大的时候,可以忽略,可如果是长期项目的话 ...
- iOS:在OC中调用JS脚本
示例一:在webView中调用js脚本进行搜索 1.首先导入JavaScriptCore.framework这个框架 2.创建webView.设置代理.请求手机端百度 #import "Vi ...
- Java&Selenium调用JS实现高亮被操作页面元素高亮
Java&Selenium调用JS实现高亮被操作页面元素高亮 /* * the method of invoking js to do something * * @author daviey ...
- Django调用JS、CSS、图片等静态文件
zz 在下面的例子中,我们将media作为静态(CSS\JS\图片文件)文件的目录 方法一. 1.首先在settings.py文件中自定义参数 STATIC_PATH=’./media’ .(意为当前 ...
- Django: 配置和静态文件
运行django-admin.py startproject [project-name] 命令会生成一系列文件,在django 1.6版本以后的settings.py文件中有以下语句: # Buil ...
- Django配置与静态文件
settings.py """ Django settings for myproject project. Generated by 'django-admin sta ...
- Django 配置访问静态文件
1.settings.py 首先在 settings 文件中,引用 os 模块: import os 定义根目录: BASE_DIR = os.path.dirname(os.path.dirna ...
- django配置静态文件
django配置静态文件 参考文章链接:http://blog.csdn.net/hireboy/article/details/8806098
随机推荐
- cocos2d-x lua table与json的转换
cocos2d-x lua table与json的转换 version: cocos2d-x 3.6 1.引入json库 require("src/cocos/cocos2d/json&qu ...
- linux-cat/less/more/tail
都可以查看文件 不同点 cat:全部查看不分屏显示 定位到ccc结尾的那行 [root@besttest tmp]# cat yumyum.log|grep ccc$ aaaaaaaaaaaaaaaa ...
- [改善Java代码]小心switch带来的空值异常
使用枚举定义常量时,会伴有大量的switch语句判断,目的是伪类每个枚举项解释其行为,例如: public class Client { public static void main(String[ ...
- poj 2104 划分树
思路:裸的划分树 #include<iostream> #include<algorithm> #include<cstring> #include<cstd ...
- 【转】创业C2C(Copy To China):停车位共享APP,用户、市政能够买账?
如果周六中午想开车到旧金山的Mission吃顿早午餐,笔者劝您还是省省吧.因为不光是到了吃饭的地儿排队得耗上一个小时,就是满大街的兜圈子找停车位都能折腾死人.那个时候您或许就明白了,其实最苦的并不是买 ...
- .NET学习笔记(1)— C#学习路线图
目录 一:引言 二:.NET技术体系 三:常用工具汇总 四:学习资源汇总 五:书籍推荐 六:关于阅读技术书籍的经验 七:总结 一:引言 因为工作调整,从PHP开发零基础转型到.NET开发,前期没有 ...
- Slickflow.NET 开源工作流引擎基础介绍(一) -- 引擎基本服务接口API介绍
1. 工作流术语图示 图1 流程图形的BPMN图形元素表示 1) 流程模型定义说明流程(Process):是企 ...
- kettle
Kettle(中文名称叫水壶)是一款ETL工具,纯java编写,可以在Window.Linux.Unix上运行,绿色无需安装,数据抽取高效稳定.Kettle家族包括4个产品:Spoon.Pan.CHE ...
- sql2005导出数据字典
右击要导出的数据库,点击 新建视图 粘贴下面代码 SELECT 表名= then d.name else '' end, 表说明= then isnull(f.value,'') else '' en ...
- html5 canvas 圆形抽奖的实例
年底没啥,抽空学习了canvas,写了个html5抽奖的代码,造了个轮子,有用的童鞋可以拿走. 其中,canvas.onclick触发抽奖行为,概率可以在core.lottery()函数上添加,美化也 ...