前面我们编写了一个经过测试的投票应用,现在让我们给它添加一张样式表和一张背景图片。

除了由服务器生成的HTML文件外,WEB应用一般需要提供一些其它的必要文件,比如图片文件、JavaScript脚本和CSS样式表等等,用来为用户呈现出一个完整的网页。在Django中,我们将这些文件统称为“静态文件”,因为这些文件的内容基本是固定不变的,不需要动态生成。

对于小项目,这些都不是大问题,你可以将静态文件放在任何你的web服务器能够找到的地方。但是对于大型项目,尤其是那些包含多个app在内的项目,处理那些由app带来的多套不同的静态文件是个麻烦活。

但这正是django.contrib.staticfiles的用途:它收集每个应用(和任何你指定的地方)的静态文件到一个统一指定的地方,并且易于访问。

一、使用静态文件

首先在你的polls目录中创建一个static目录。Django将在那里查找静态文件,这与Django在polls/templates/中寻找对应的模板文件的方式是一致的。

Django的STATICFILES_FINDERS设置项中包含一个查找器列表,它们知道如何从各种源中找到静态文件。 其中一个默认的查找器是AppDirectoriesFinder,它在每个INSTALLED_APPS下查找static子目录,例如我们刚创建的那个static目录。admin管理站点也为它的静态文件使用相同的目录结构。

在刚才的static目录中新建一个polls子目录,再在该子目录中创建一个style.css文件。换句话说,这个css样式文件应该是polls/static/polls/style.css。你可以通过书写polls/style.css在Django中访问这个静态文件,与你如何访问模板的路径类似。

静态文件的命名空间:

与模板类似,我们可以将静态文件直接放在polls/static(而不是创建另外一个polls 子目录),但实际上这是一个坏主意。Django将使用它所找到的第一个匹配到的静态文件,如果在你的不同应用中存在两个同名的静态文件,Django将无法区分它们。我们需要告诉Django该使用其中的哪一个,最简单的方法就是为它们添加命名空间。也就是说,将这些静态文件放进以它们所在的应用的名字同名的另外一个子目录下(白话讲:多建一层与应用同名的子目录)。

PS:良好的目录结构是每个应用都应该创建自己的urls、forms、views、models、templates和static,每个templates包含一个与应用同名的子目录,每个static也包含一个与应用同名的子目录。

将下面的代码写入样式文件polls/static/polls/style.css

li a {
color: green;
}

接下来在模板文件polls/templates/polls/index.html的头部加入下面的代码:

{% load static %}

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

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

重启服务器,在浏览器访问http://localhost:8000/polls/,你会看到Question的超级链接变成了绿色(Django风格!),这意味着你的样式表被成功导入了。(如果不行就ctrl + F5强制刷新浏览器页面,防止缓存。)

通过查看浏览器中的网络访问,这个css文件的地址显示的是:http://127.0.0.1:8000/static/polls/style.css

二、添加背景图片

下面,我们在polls/static/polls/目录下创建一个用于存放图片的images子目录,在这个子目录里放入`background.gif文件。换句话说,这个文件的路径是polls/static/polls/images/background.gif。(你可以使用任何你想要的图片)

在css样式文件polls/static/polls/style.css中添加下面的代码:

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

重新加载http://localhost:8000/polls/(CTRL+F5或者直接F5),你会在屏幕的左上角看到载入的背景图片。

提示:

很显然,{% static %}模板标签不能用在静态文件,比如样式表中,因为他们不是由Django生成的。 你应该使用相对路径来相互链接静态文件,因为这样你可以改变STATIC_URL( static模板标签用它来生成URLs)而不用同时修改一大堆静态文件中路径相关的部分。

通过查看浏览器中的网络访问,图片显示地址是:http://127.0.0.1:8000/static/polls/images/background.gif

三、直接访问静态文件

实际上不管是在Django开发服务器上,还是在nginx+uwsgi+django部署的服务器上,都可以直接通过url访问静态文件,不需要在Django中专门为每个静态文件编写url路由和视图。

比如,通过http://www.liujiangblog.com/static/images/default_avatar_male_50.gif你就可以直接获得网站用户的默认头像图片了。

默认的是STATIC_URL = '/static/',经过实践,不加STATIC_URL = '/static/' STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]也能找到css文件,若是找不到css文件,可以加上这个配置
# 需要在settings中设置下面代码才可以工作,否则找不到css文件 STATIC_URL = '/static/' STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]

第一个Django应用 - 第六部分:静态文件的更多相关文章

  1. Django学习之十: staticfile 静态文件

    目录 Django学习之十: staticfile 静态文件 理解阐述 静态文件 Django对静态文件的处理 其它方面 总结 Django学习之十: staticfile 静态文件 理解阐述     ...

  2. 当Django中Debug=False,静态文件处理方式。

    Django设置DEBUG为False时,'django.contrib.staticfiles'会关闭,即Django不会自动搜索静态文件,静态文件不能加载导致的问题有两个: 1.页面排版不正常,即 ...

  3. django 项目运行时static静态文件不能加载问题处理

    一.首先检查网页中的加载路径是否正确,如果和文件所在路径不一致,就把html改下路径 二.加载路径和文件实际路径一致,看下配置文件: STATIC_URL = '/static/'STATIC_ROO ...

  4. Django 配置文件settings注解(含静态文件和上传文件配置)

    基于Django1.11配置文件settings.py import os import sys # Build paths inside the project like this: os.path ...

  5. Django框架----模板继承和静态文件配置

    母板 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...

  6. django复习-2-配置、静态文件与路由

    一.配置文件 1. BASE_DIR BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) __file__指当 ...

  7. django官方文档--对静态文件的管理

    一.入门级理解: 在django中对静态文件的管理和模板(template)的思路是一样的.在模板的管理中django是把app用到 到的模板都保存到app目录下的templates子目录中. 静态文 ...

  8. Django部署生产环境,静态文件不能访问404,以及图片不能访问403

    部署环境的搭建请看此博客https://blog.csdn.net/anifans9350/article/details/80145535 查看nginx.conf 文件, nginx文件(etc/ ...

  9. Django模版中加载静态文件配置详解

    .settings.INSTALLED_APPS下添加:django.contrib.staticfiles .settings.py下添加:STATIC_URL = '/static/' . ()在 ...

随机推荐

  1. spingboot打jar包

    pom.xml文件中packaging为jar <packaging>jar</packaging> 安装插件 <plugin> <groupId>or ...

  2. 使用 Abp.Zero 搭建第三方登录模块(三):网页端开发

    ​简短回顾一下网页端的流程,总的来说网页端的职责有三: 生成一个随机字符作为鉴权会话的临时Token, 生成一个小程序码, Token作为参数固化于小程序码当中 监控整个鉴权过程状态,一旦状态变为AU ...

  3. 基于串口校时的数字钟设计(verilog实现)

    任务: 电路图设计: 设计: 模块1:1.先设计一个计数时钟,为了仿真方便,这里把1000ns当作1s. 创建一个计数器second_lim,当计数到1000/20时清零,即1s. 秒显示器secon ...

  4. maven exclusion 理解

    结论:exclusion 表示对传递性依赖进行排除,排除后当前项目的依赖jar中,就不会包含该传递性依赖. 扩展:项目中的jar 都会在classpath下,排除后的传递性依赖,相当于在classpa ...

  5. mysql开发实战8问

    mysql读写性能是多少,有哪些性能相关的配置参数? Mysql负载高时,如何找到是由哪些SQL引起的? 如何针对具体的SQL做优化? SQL层面已难以优化,请求量继续增大时的应对策略? Mysql如 ...

  6. git diff与linux diff的输出格式之unified format

    前言 前面有一篇文章<一个有些意思的项目--文件夹对比工具(一)>,里面简单讲了下diff算法之--Myers算法. 既然是算法,就会有实现,比如git diff中有Myers的实现,gi ...

  7. CF717 Festival Organization

    \(CF717\ Festival\ Organization\) Description 一个合法的串定义为:长度在 \([l,r]\) 之间,且只含 \(0,1\),并且不存在连续 \(2\) 个 ...

  8. 利用图像二维熵实现视频信号丢失检测(Signal Loss Detection)

    1 图像二维熵 图像二维熵作为一种特征评价尺度能够反映出整个图像所含平均信息量的高低,熵值(H)越大则代表图像所包含的信息越多,反之熵值(H)越小,则图像包含的信息越少.对于图像信息量,可以简单地认为 ...

  9. 解决国内不能访问github的问题

    问题 最近访问GitHub总是不稳定,经常连不上, 出各种错误(OpenSSL SSL_read: Connection was reset, errno 10054, Connection refu ...

  10. JAVA语言基础组成(2)

    函数  函数的定义 1.什么是函数? 函数就是定义在类中的具有特定功能的一段独立小程序.函数也称为方法. 2.函数的格式: 修饰符 返回值类型 函数名(参数类型 形式参数1,参数类型 形式参数2,.. ...