Actual combat Django: official Example Part6

We finally ushered in the last part of the official example. In this section, you are willing to introduce Django's static file management.

Now, we're going to add a CSS style sheet and a picture to this voting app.

A complete Web page file, in addition to HTML documents, usually need some other files, than slices, JS or CSS, these files, which we call "static files."

In those small projects, we don't need to focus too much on static files, because you can put these files anywhere, as long as your server can find them. But in a larger project, especially those with many applications, the management of static files becomes very important, so Sao year, or from the beginning to develop a good static file management habits it!

25. Add a style sheet

First, create a folder called static under the polls folder, and Django will automatically find the folder, just as it can automatically check out our template folder.

Django has a series of static file search methods. One of them is to look for a static folder under your App folder.

After you have built the static folder, build a polls folder under static , and then create a polls folder named Styles.css. the file. The correct path for this file should be:

Polls/static/polls/style.css

Add the following to the styles.css :

polls/static/polls/style.css:

{    color: green;}

Next, edit the polls/templates/polls/index.html file and insert the following code at the beginning:

polls/templates/polls/index.html :

{% load staticfiles%} <link rel= "stylesheet" type= "Text/css" href= " {% static ' polls/style.css '%} "/>

{% load staticfiles%} loaded {% static%} template label, this {% static%} template tag is responsible for generating the absolute path of this static file (STYLE.CSS).

Let's Open the Django server (how do I turn it on?) Please return to read Part1) and then visit http://127.0.0.1:8000/polls/and you will see that "What's up?" "Has turned green, which means our style sheet (STYLE.CSS) is already functioning.

26. Add a background map

Below, we are going to create a picture folder, create a images folder under the polls/static/polls/folder, Then put a file called Background.gif in this folder (find a picture you think fit, change to this name), the correct path to this file should be:

Polls/static/polls/images/background.gif

Then, add the following to the style sheet (style.css):

polls/static/polls/style.css :

{    background: white url ("images/background.gif");}

Refresh the browser and you can see the background map we just added.

Well, we have this official example introduced here, have a certain English reading ability of children's shoes, suggest to the Django official website (https://www.djangoproject.com/) Download official documents to read.

In the future this time, will be willing to organize a number of instances of their own to introduce to you.

Finally, the source code of the whole example is attached: willing to learn the garden Download Center

This article copyright to willing to learn all, welcome reprint, reproduced please indicate the author and source. Thank you!
Willing
Starter: Willing to learn Yuan @ Blog Park

Actual combat Django: official Example Part6