django模板导入js,css等外部文件
2015-11-03 16:35
676 查看
html模板里面使用了css,但是直接引用不能,搜了一些资料终于搞定,这里记录以下。
首先是我文件的tree:
mysite:
-myapp:
--admin.py, models.py, _init_.py, views.py, test.py, template文件夹
-mysite:
--_init_.py, settings.py, urls.py, wsgi.py
-manage.py
开始配置:
首先在根目录mysite里新建static文件夹
打开settings.py,在底部添加:
import os
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(os.path.dirname(__file__), '../static/').replace('\\','/'),
)
打开urls.py,添加:
import settings
urlpatterns = patterns('',
# Examples:
# url(r'^$', 'mysite.views.home', name='home'),
# url(r'^blog/', include('blog.urls')),
url(r'^admin/', include(admin.site.urls)),
url( r'^static/(?P<path>.*)$', 'django.views.static.serve',{ 'document_root': settings.STATIC_URL }),
url(r'myapp/','myapp.views.home'),
)
然后将你的css,js文件以及html中引用的静态图片都放置在static文件夹里。
在html模板里调用:
<link rel="stylesheet" href="../../static/css/style.css" type="text/css">注意href就是你在static里面css等的路径。
然后启动python manage.py runserver
访问http://127.0.0.1:8000/static/css/style.css
若能访问文件,说明你css等静态文件已经可以被django找到了,这时访问你 的模板对应的页面就可以发现页面可以引用css了
首先是我文件的tree:
mysite:
-myapp:
--admin.py, models.py, _init_.py, views.py, test.py, template文件夹
-mysite:
--_init_.py, settings.py, urls.py, wsgi.py
-manage.py
开始配置:
首先在根目录mysite里新建static文件夹
打开settings.py,在底部添加:
import os
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(os.path.dirname(__file__), '../static/').replace('\\','/'),
)
打开urls.py,添加:
import settings
urlpatterns = patterns('',
# Examples:
# url(r'^$', 'mysite.views.home', name='home'),
# url(r'^blog/', include('blog.urls')),
url(r'^admin/', include(admin.site.urls)),
url( r'^static/(?P<path>.*)$', 'django.views.static.serve',{ 'document_root': settings.STATIC_URL }),
url(r'myapp/','myapp.views.home'),
)
然后将你的css,js文件以及html中引用的静态图片都放置在static文件夹里。
在html模板里调用:
<link rel="stylesheet" href="../../static/css/style.css" type="text/css">注意href就是你在static里面css等的路径。
然后启动python manage.py runserver
访问http://127.0.0.1:8000/static/css/style.css
若能访问文件,说明你css等静态文件已经可以被django找到了,这时访问你 的模板对应的页面就可以发现页面可以引用css了
相关文章推荐
- JavaScript高级程序设计之DOM之DOM 操作技术之动态脚本第10.2.1讲
- S控制滚动条的位置
- Moment.js
- JavaScript 复制内容到剪贴板
- 彻底理解JavaScript原型
- js,JSON转字符串遇到的问题
- json-list串研究
- JavaScript高级程序设计之DOM之节点层次之Attr类型第10.1.9讲
- JavaScript基础学习(三)----Array数组对象
- response content-type json
- json对象中的值被引用两次的问题
- JavaScript高级程序设计之DOM之节点层次之DocumentFragment类型第10.1.8讲
- Javascript进阶篇——( 事件响应)笔记整理
- js获得日期操作,以及日期的格式化
- jsp页面的数显示两位小数
- jsp页面中jstl标签详解
- ajax 的json联动
- JS图片加倒影
- js中this的用法
- JS中对Map操作+el表达式使用map显示界面