已经同步到gitbook,想阅读的请转到gitbook: Django 1.10 中文文档
Writing your first Django app, part 6¶
This tutorial begins where Tutorial 5 left off. We’ve built a tested Web-poll application, and we’ll now add a stylesheet and an image.
紧接着教程5,我们已经创建了一个已被测试过的web投票应用,并且我们也加了样式和图片
Aside from the HTML generated by the server, web applications generally need to serve additional files — such as images, JavaScript, or CSS — necessary to render the complete web page. In Django, we refer to these files as “static files”.
除了由服务器生成的HTML文件外,网页应用一般需要提供其它必要的文件 —— 比如图片、JavaScript和CSS样式表 —— 来为用户呈现出一个完整的页面。 在Django中,我们将这些文件称为“静态文件”。
For small projects, this isn’t a big deal, because you can just keep the static files somewhere your web server can find it. However, in bigger projects – especially those comprised of multiple apps – dealing with the multiple sets of static files provided by each application starts to get tricky.
对于小型项目,这不是个大问题,将它们放在你的web服务器可以访问到的地方就可以了。 然而,在大一点的项目中 —— 尤其是那些由多个应用组成的项目 —— 处理每个应用提供的多个静态文件集合开始变得很难。
That’s what django.contrib.staticfiles is for: it collects static files from each of your applications (and any other places you specify) into a single location that can easily be served in production.
这正是django.contrib.staticfiles要解决的:它收集每个应用(和任何你指定的地方)的静态文件到一个单独的位置,这个位置在线上可以很容易维护。
Customize your app’s look and feel¶
First, create a directory called static in your polls directory. Django will look for static files there, similarly to how Django finds templates inside polls/templates/.
首先在你的polls中创建一个static目录。Django将在那里查找静态文件,这与Django在polls/templates/中寻找对应的模板文件的方式是一样的
Django’s STATICFILES_FINDERS setting contains a list of finders that know how to discover static files from various sources. One of the defaults is AppDirectoriesFinder which looks for a “static” subdirectory in each of the INSTALLED_APPS, like the one in polls we just created. The admin site uses the same directory structure for its static files.
Django 的 INSTALLED_APPS设置包含一个查找器,它们知道如何从各种源找到静态文件。 其中默认的一个是AppDirectoriesFinder,它在每个INSTALLED_APPS下查找“static”子目录,就像刚刚在polls
中创建的一样。管理站点也为它的静态文件使用相同的目录结构。
Within the static directory you have just created, create another directory called polls and within that create a file called style.css. In other words, your stylesheet should be at polls/static/polls/style.css. Because of how the AppDirectoriesFinder staticfile finder works, you can refer to this static file in Django simply as polls/style.css, similar to how you reference the path for templates
在你刚刚创建的static目录中,创建另外一个目录polls并在它下面创建一个文件style.css。换句话讲,你的样式表应该位于polls/static/polls/style.css。根据AppDirectoriesFinder 静态文件查找器的原理,你可以通过polls/style.css在Django中访问这个静态文件,与你如何访问模板的路径类似。
Static file namespacing
Just like templates, we might be able to get away with putting our static files directly in polls/static (rather than creating another polls subdirectory), but it would actually be a bad idea. Django will choose the first static file it finds whose name matches, and if you had a static file with the same name in a different application, Django would be unable to distinguish between them. We need to be able to point Django at the right one, and the easiest way to ensure this is by namespacing them. That is, by putting those static files inside another directory named for the application itself.
与模板类似,我们可以将静态文件直接放在polls/static(而不是创建另外一个polls 子目录),但实际上这是一个坏主意。Django将使用它所找到的第一个符合要求的静态文件的文件名,如果在你的不同应用中存在两个同名的静态文件,Django将无法区分它们。我们需要告诉Django该使用其中的哪一个,最简单的方法就是为它们添加命名空间。 也就是说,将这些静态文件放进以它们所在的应用的名字命名的另外一个目录下。
Put the following code in that stylesheet (polls/static/polls/style.css):
将以下代码写到样式表(polls/static/polls/style.css):
polls/static/polls/style.css
li a {
color: green;
}
Next, add the following at the top of polls/templates/polls/index.html:
接下来在polls/templates/polls/index.html文件添加如下代码:
polls/templates/polls/index.html
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}" />
The{% raw %} {% static %}{% endraw %} template tag generates the absolute URL of static files.
{% raw %} {% static %}{% endraw %} 标签生成静态文件的绝对URL路径
That’s all you need to do for development. Reload http://localhost:8000/polls/ and you should see that the question links are green (Django style!) which means that your stylesheet was properly loaded.
这就是你在开发过程中所需要对静态文件做的所有处理。 重新加载http://localhost:8000/polls/,你应该会看到Question的超链接变成了绿色(Django的风格!),这意味着你的样式表被成功导入。
Adding a background-image¶
添加背景图片¶
Next, we’ll create a subdirectory for images. Create an images
subdirectory in the polls/static/polls/ directory. Inside this directory, put an image called background.gif. In other words, put your image inpolls/static/polls/images/background.gif.
下一步,我们将创建一个子目录来存放图片。 在polls/static/polls/目录中创建一个 images 子目录。在这个目录中,放入一张图片background.gif。换句话,将你的图片放在 polls/static/polls/images/background.gif。
Then, add to your stylesheet (polls/static/polls/style.css):
然后,向你的样式表添加(polls/static/polls/style.css):
polls/static/polls/style.css
body { background: white url("images/background.gif") no-repeat right bottom;}
Reload http://localhost:8000/polls/ and you should see the background loaded in the bottom right of the screen.
重新加载http://localhost:8000/polls/,你应该在屏幕的右下方看到载入的背景图片。
Warning
Of course the{% raw%} {% static %} {% endraw%} template tag is not available for use in static files like your stylesheet which aren’t generated by Django. You should always use relative paths to link your static files between each other, because then you can change STATIC_URL (used by the static template tag to generate its URLs) without having to modify a bunch of paths in your static files as well.
当然,{% static %}模板标签不能用在静态文件(比如样式表)中,因为他们不是由Django生成的。你应该永远使用相对路径来相互链接静态文件,因为这样你可以改变STATIC_URL(static 模板标签用它来生成URLs)而不用同时修改一大堆静态文件的路径。
These are the basics. For more details on settings and other bits included with the framework see the static files howto and the staticfiles reference. Deploying static files discusses how to use static files on a real server.
这些就是静态文件的基础知识。关于静态文件设置的更多细节和框架中包含的其它部分,参见the static files howto and the staticfiles reference. Deploying static files 讨论如何在真实的服务器上使用静态文件。
When you’re comfortable with the static files, read part 7 of this tutorial to learn how to customize Django’s automatically-generated admin site.
当你熟悉了静态文件,请看 [教程7](https://www.gitbook.com/book/run-noob/django-chinese-docs-1-10/edit#/edit/master/First steps/Writing your first Django app part 7.md?_k=zk0rz8) 学习如何定制Django自动生成的admin站点。