我们终于迎来了官方实例的最后一个Part。在这一节中,舍得要向大家介绍Django的静态文件管理。

现在,我们要往这个投票应用里面添加一个CSS样式表和一张图片。

一个完整的网页文件,除了html文档外,通常还需要其它一些文件,比如图片、JS或者CSS,这些文件,我们称之为“静态文件”。

在那些小项目中,我们不需要对静态文件关注太多,因为你可以将这些文件随便放置,只要你的服务器能查找得到就好。但在大一点的项目中,尤其是那些拥有好多个应用的项目,静态文件的管理便变得非常重要,所以骚年,还是从一开始就养成良好的静态文件管理习惯吧!

 

25.添加样式表


首先,在polls文件夹下创建一个叫static的文件夹,Django会自动查找到这个文件夹,就象它能自动查到我们的模板文件夹一样。

Django拥有一系列的静态文件查找手段。其中一种就是在你的应用文件夹下查找有没有static文件夹。

在你把static文件夹建好后,接着在static下面建一个polls文件夹,然后在这个polls文件夹下创建一个叫styles.css的文件。这个文件的正确路径应该是:

polls/static/polls/style.css

styles.css中加入下列内容:

polls/static/polls/style.css:

li a {
color: green;
}

接下来,编辑polls/templates/polls/index.html 文件,在开头处插入下述代码:

polls/templates/polls/index.html

{% load staticfiles %}

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

{% load staticfiles %} 加载了 {% static %}模板标签,这个 {% static %}模板标签负责生成这个静态文件(style.css)的绝对路径。

让我们开启Django服务器(如何开启?请返回阅读Part1),然后访问http://127.0.0.1:8000/polls/,你会看到那个“What's Up?”已经变成了绿色,这就说明我们的样式表(style.css)已经发挥作用了。

 

26.添加背景图


下面,我们要创建一个图片文件夹,在polls/static/polls/文件夹下创建一个images文件夹,然后在这个文件夹里放一个叫background.gif的文件(找一个你认为合适的图片,改成这个名字就行),这个文件的正确路径应该是:

polls/static/polls/images/background.gif

然后,往样式表(style.css)里添加以下内容:

polls/static/polls/style.css

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

刷新一下浏览器,你可以看到我们刚加上去的背景图。

好了,我们这个官方实例就介绍到这里,有一定英文阅读能力的童鞋,建议到Django官方网站(https://www.djangoproject.com/)下载官方文档来阅读。

在今后这段时间,舍得还会将自己整理的多个实例陆续介绍给大家。

最后,附上整个实例的源代码,下载地址:舍得学苑下载中心

 

本文版权归舍得学苑所有,欢迎转载,转载请注明作者和出处。谢谢!

作者:舍得

首发:舍得学苑@博客园

实战Django:官方实例Part6的更多相关文章

  1. 实战Django:官方实例Part1

    [写在前面] 撰写这个实战系列的Django文章,是很久之前就有的想法,问题是手头实例太少,一旦开讲,恐有"无米下锅"之忧. 随着对Django学习的深入,渐渐有了些心得,把这些心 ...

  2. 实战Django:官方实例Part2

    我们接着Part1部分往下讲.我们在part1中启动服务器后,并没有在管理页面中发现新添加的Polls应用,怎么办捏? 7.在管理界面中显示Question 只要注册一下这个应用就可以了.编辑poll ...

  3. 微软官方实例 RazorPagesMovie 在 asp.net core 2.1 版本下的实战

    微软官方实例 RazorPagesMovie 在 asp.net core 2.1 版本下的实战 友情提示: 操作系统: MacOS 10.13.5 dotnet core: version 2.1. ...

  4. 实战Django:简易博客Part1

    舍得学习新技能的时候,通常不喜欢傻读书--捧着一本阐述该项技能的书籍,然后傻看,一路看下来,脑子里塞满了新的概念.知识点,头是越来越大,但技能却几乎没掌握半分. 多年来,舍得养成了用做实例来学习新技能 ...

  5. 对《[Unity官方实例教程 秘密行动] Unity官方教程《秘密行动》(十二) 角色移动》的一些笔记和个人补充,解决角色在地形上移动时穿透问题。

    这里素材全是网上找的. 教程看这里: [Unity官方实例教程 秘密行动] Unity官方教程<秘密行动>(九) 角色初始设定 一.模型设置: 1.首先设置模型的动作无限循环. 不设置的话 ...

  6. Android实例-Delphi开发蓝牙官方实例解析(XE10+小米2+小米5)

    相关资料:1.http://blog.csdn.net/laorenshen/article/details/411498032.http://www.cnblogs.com/findumars/p/ ...

  7. 微信应用号开发知识贮备之altjs官方实例初探

    天地会珠海分舵注:随着微信应用号的呼之欲出,相信新一轮的APP变革即将发生.从获得微信应用号邀请的业内人士发出来的一张开发工具源码截图可以看到,reacjs及其相应的FLUX框架altjs很有可能会成 ...

  8. 源于《Unity官方实例教程 “Space Shooter”》思路分析及相应扩展

    教程来源于:Unity官方实例教程 Space Shooter(一)-(五)       http://www.jianshu.com/p/8cc3a2109d3b 一.经验总结 教程中步骤清晰,并且 ...

  9. 超具体Windows版本号编译执行React Native官方实例UIExplorer项目(多图慎入)

    ),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客右側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...

随机推荐

  1. SVN-服务器搭建、apache2整合、eclipse使用

    如题,分成3个部分: 1.SVN服务器搭建.操作系统Ubuntu 14.04.2 LTS.具体方法度娘很多,不再细数. 安装:sudo apt-get install subversion 创建版本库 ...

  2. git小操作之checkout、stash

    git checkout会带上当前changed但没有commit的内容到目标分支 git stash用来暂存当前改动,并且会退代码到上一个commit:git stash pop则取出所stash的 ...

  3. Redis附加功能之Redis流水线pipeline

    流水线功能的目的:通过减少客户端与服务器之间的通信次数来提高程序的执行效率. 一.通信 在一般情况下, 用户每执行一个 Redis 命令,客户端与服务器都需要进行一次通信:客户端会将命令请求发送给服务 ...

  4. Codeforces Round #218 (Div. 2) B. Fox Dividing Cheese

    B. Fox Dividing Cheese time limit per test 1 second memory limit per test 256 megabytes input standa ...

  5. 第三方登录 QQ登录 人人网登录 新浪微博登录

    http://www.pp6.cn/Index.aspx http://www.pp6.cn/Login.aspx 网站有自己的账号系统,这里使用的第三方登录仅仅是获取第三方账号的唯一id,昵称,性别 ...

  6. python的文件操作方法

    python中的文件对象:文件对象不仅可以用来访问普通的磁盘文件, 而且也可以访问任何其它类型抽象层面上的"文件". 一旦设置了合适的"钩子", 你就可以访问具 ...

  7. c++回调

    c++回调包含类函数回调和非类函数回调. 类函数回调,函数指针指向函数名称,需要带类作用域,调用时需要用到类指针. 如qt里面定义一个返回值为qbytearray的函数指针, typedef QByt ...

  8. VC与JavaScript交互(一) --- 如何实现

    为什么要让VC与JavaScript交互? 1.有时候我们需要让自己的软件打开一个网页,来获取页面上的一些数据.这时,可以用mshtml解析HTML提取出数据,也可以向HTML文档动态写入我们准备好的 ...

  9. (总结)Web性能压力测试工具之WebBench详解

      PS:在运维工作中,压力测试是一项很重要的工作.比如在一个网站上线之前,能承受多大访问量.在大访问量情况下性能怎样,这些数据指标好坏将会直接影响用户体验.但是,在压力测试中存在一个共性,那就是压力 ...

  10. RequireJS首次加载偶尔失败

    现象:第一次加载JS文件,首次加载偶尔失败: 原因:require(['jquery', 'operamasks', 'zTree', 'jQueryCookie'],中前后引用同步加载: 解决方式: ...