这篇教程从第5节开始,我们已经创建了一个测试过的web投票应用,现在我们会添加一个表格和一张图片。
除了由服务器生成的HTML,web应用通常也需要提供额外的文件 —— 例如图片、JS或者CSS,这些都是用来渲染完整的Web页面。在Django里,我们把这些文件统一称为“静态文件”。
对于小的项目,这个不是大问题,因为你只需要把静态文件放在你的web服务器可以找到的地方久可以了。然而,在大的项目里,特别是由多个app组成的项目。处理每个app提供的多个静态文件集合就开始变得棘手了。
这就是django.contrib.staticfiles处理的事情:它从你的每个应用(或者你指定的其他位置)里收集静态文件到一个单独的位置,这个位置在生产环境可以简单地供客户端访问。
定制你的APP的外观和感觉
首先,在你的polls
目录里创建一个名为static
的目录,Django会在这里查找静态文件,这个和Django在polls/templates/
里查找模板文件很相似。
Django的STATICFILES_FINDERS
设置包含了一个查找目录列表,知道怎么去多个资源位置查找静态文件。默认设置是AppDirectoriesFinder
,用来在每个INSTALLED_APPS
目录下面寻找static
子目录。就像我们刚才在polls
下面创建的那个。admin站点也是用这种方式管理他的静态文件。
在你刚创建的static
目录里面,创建一个polls
目录,然后在polls
目录里面创建一个叫做style.css
的文件。换句话说,你的样式文件路径应该是polls/static/polls/style.css
。因为AppDirectoriesFinder
静态文件查找器的工作方式,以后你可以在Django里简单地通过polls/style.css
这样来引用静态文件。和你引用模板的路径相似。
静态文件命名空间
和模板一样,我们可以直接将静态文件放在polls/static
里(而不是创建一个polls子目录),但这样做不是很好。因为Django会选择第一个名称匹配的静态文件,如果你在不同的应用里有相同名称的静态文件的话,Django是没用能力分辨这些同名文件之间的区别的,只会使用第一个找到的文件。所以最简单的方式就是把他们放到命名空间里。就是把这些静态文件放到一个应用名称的子目录下面。
把下面的代码放到样式表里面(polls/static/polls/style.css
):
li a {
color: green;
}
下一步,把下面的代码添加到polls/template/polls/index.html
文件的顶端:
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}" />
{% static %}
模板标签生成静态文件的绝对url路径。这就是你在开发中要做的所有事情,重新加载http://localhost:8000/polls/
地址,你会看到question的链接是绿色的(Django 风格),意味着你的样式表正常加载了。
添加一个背景图象
下一步,我们要为图象创建一个子目录,在polls/static/polls/
目录下面创建一个images
子目录,在这个目录里面,放一个叫做background.gif的图片文件。换句话说,你的图片文件位置是:polls/static/polls/images/background.gif
.
然后,把下面的代码添加到你的样式表(polls/static/poll/style.css
)里。
body {
background: white url("images/background.gif") no-repeat right bottom;
}
重新加载http://localhost:8000/polls/
你会发现背景图在屏幕的右上方。
警告
像你的样式表那样使用{% static %}
模板标签当然不可用,特别是文件不是由Django生成的时候。你应该经常使用相对路径来链接你的静态文件。因为这样后面你才能修改STATIC_URL
(被STATIC
模板标签用来生成它自己的URL路径)而不需要修改你的静态文件里的一堆路径。
上面这些都是基础内容,对于更多的设置细节以及其他包含框架的的内容,可以看官方文档怎么组织静态文件和静态文件引用。分发静态文件这篇文档则是讨论怎么在一个真实的服务器上使用静态文件。
当你熟悉了怎么使用静态文件以后,就可以学习第7节的内容,关于怎么定制Django的自动生成式管理站点了。
网友评论