Django项目实战——用户投票系统

Django项目实战——用户投票系统

• Django项目实战——用户投票系统(六)
• • 前情回顾
  • 正文开始
  • • 自定义应用的界面与风格
    • 添加一个背景图
  • 未完待续

Django项目实战——用户投票系统(六) 前情回顾

在上一章，我们完成了对一个项目的测试阶段，一个在项目完成过程中必要的测试。

接下来我们将开始提高学习静态文件来丰富网页。

本案例将添加一个样式表和一个图像。

正文开始

同样的——官方文档链接附上：
编写你的第一个 Django 应用，第 6 部分 | Django 文档 | Django (djangoproject.com)

除了服务端生成的 HTML 以外，网络应用通常需要一些额外的文件——比如图片，脚本和样式表——来帮助渲染网络页面。

在 Django 中，我们把这些文件统称为“静态文件”。

在大项目——特别是由好几个应用组成的大项目——中，处理不同应用所需要的静态文件的工作就显得有点麻烦了。

这就是 django.contrib.staticfiles 存在的意义：它将各个应用的静态文件（和一些你指明的目录里的文件）统一收集起来，这样一来，在生产环境中，这些文件就会集中在一个便于分发的地方。

自定义应用的界面与风格

步骤为：

1. 在polls目录下创建一个名为static的目录（在该目录下存放静态文件）

Django 的 STATICFILES_FINDERS 设置包含了一系列的查找器，它们知道去哪里找到 static 文件。

AppDirectoriesFinder 是默认查找器中的一个，它会在每个 INSTALLED_APPS 中指定的应用的子文件中寻找名称为 static 的特定文件夹，就像我们在 polls 中刚创建的那个一样。

管理后台采用相同的目录结构管理它的静态文件。

2. 在static文件夹中创建一个名为polls文件夹
3. 在polls文件夹中创建一个名为style.css的文件，总体路径为：样式表路径应是 polls/static/polls/style.css

静态文件命名空间

Django 只会使用第一个找到的静态文件。

如果你在 其它 应用中有一个相同名字的静态文件，Django 将无法区分它们。

我们需要指引 Django 选择正确的静态文件，而最好的方式就是把它们放入各自的 命名空间 。

也就是把这些静态文件放入 另一个 与应用名相同的目录中。

4. 将以下代码放入样式表(polls/static/polls/style.css)：

   li a {
       color: white;\\字体为白色
   }
   

5. 在 polls/templates/polls/index.html 的文件头添加以下内容

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

   {% static %} 模板标签会生成静态文件的绝对路径。
   

   
   

   这就是你开发所需要做的所有事情了。
   

   
   

   启动服务器(如果它正在运行中，重新启动一次):

   重新载入 http://localhost:8000/polls/ ，你会发现有问题的链接是白色的 （这是 Django 自己的问题标注方式），这意味着你追加的样式表起作用了。
   

   
   

添加一个背景图

创建一个用于存放图像的目录。

在 polls/static/polls 目录下创建一个名为 images 的子目录。

在这个目录中，放一张名为 background.jpg 的图片。

换言之，在目录 polls/static/polls/images/background.jpg 中放一张图片。

• 在你的样式表（polls/static/polls/style.css）中添加：

  body {
      background: white url("images/background.jpg") no-repeat;
  }
  

• 浏览器重载 http://localhost:8000/polls/，你将在屏幕的左上角见到这张背景图

下面，style.css整个代码如下

li a {
    color: white;
}
body {
    background: white url("images/background.jpg") no-repeat;
}

效果如下：

未完待续

上述所说的是最基本的CSS知识，当我们有了这些基础之后，前端的渲染也就不是什么大问题了

当熟悉静态文件后，下一章将来学习如何自定义 Django 自动生成后台网页的过程。