编写你的第一个 Django 应用程序,第6部分
本教程从教程 5 停止的地方开始。我们已经构建了一个经过测试的网络投票应用程序,现在我们将添加一个样式表和一个图像。
除了服务器生成的 HTML 之外,Web 应用程序通常需要提供呈现完整网页所需的其他文件(例如图像、JavaScript 或 CSS)。在 Django 中,我们将这些文件称为“静态文件”。
对于小型项目,这没什么大不了的,因为您可以将静态文件保存在Web服务器可以找到的地方。但是,在较大的项目中(尤其是由多个应用程序组成的项目),处理每个应用程序提供的多组静态文件开始变得棘手。
这就是 django.contrib.staticfiles 的用途:它将每个应用程序(以及您指定的任何其他位置)的静态文件收集到一个可以在生产中轻松提供的位置。
一、自定义应用的外观和感觉
首先,在 polls 目录中创建一个名为 static 的目录。Django 将在那里查找静态文件,类似于 Django 在 polls/templates/ 中查找模板的方式。
Django 的 STATICFILES_FINDERS 设置包含一个发现者列表,这些查找器知道如何从各种来源发现静态文件。
默认值之一是 AppDirectoriesFinder ,它在每个 INSTALLED_APPS 中查找一个“静态”子目录,就像我们刚刚创建的 polls 中的子目录一样。管理站点对其静态文件使用相同的目录结构。
在您刚刚创建的 static 目录中,创建另一个名为 polls 的目录,并在该目录中创建一个名为 style.css 的文件。
换句话说,您的样式表应该在 polls/static/polls/style.css 。
由于 AppDirectoriesFinder 静态文件查找器的工作方式,您可以在 Django 中将此静态文件称为 polls/style.css ,类似于您引用模板路径的方式。
将以下代码放入该样式表 ( polls/static/polls/style.css ):
li a {
color: red;
}
接下来,在 polls/templates/polls/index.html 的顶部添加以下内容:
{% load static %}
<link rel="stylesheet" href="{% static 'polls/style.css' %}">
{% static %} 模板标签生成静态文件的绝对 URL。
这就是您需要为开发所做的一切。
启动服务器(如果它已经在运行,则重新启动它):
$ python manage.py runserver
重新加载 http://localhost:8000/polls/ ,你应该看到问题链接是绿色的(Django风格!),这意味着你的样式表已正确加载。
二、添加背景图像
接下来,我们将为图像创建一个子目录。在 polls/static/polls/ 目录中创建一个 images 子目录。
在此目录中,添加要用作背景的任何图像文件。出于本教程的目的,我们使用一个名为 background.png 的文件,
该文件将具有完整路径 polls/static/polls/images/background.png 。
然后,在样式表中添加对图像的引用 ( polls/static/polls/style.css ):
body {
background: white url("images/background.png") no-repeat;
}
li a {
color: red;
}
重新加载 http://localhost:8000/polls/ ,您应该会看到屏幕左上角加载的背景。

这些是基础知识。有关框架中包含的设置和其他位的更多详细信息,请参阅静态文件操作方法和静态文件参考。
部署静态文件讨论了如何在真实服务器上使用静态文件。
当你熟悉静态文件时,请阅读本教程的第 7 部分,了解如何自定义 Django 自动生成的管理站点。
-----------------------------------end-------------------------------------
编写你的第一个 Django 应用程序,第6部分的更多相关文章
- 编写你的第一个django应用程序2
从1停止的地方开始,我们将设置数据库,创建您的第一个模型,并快速介绍django自动生成的管理站点 数据库设置 现在,打开mysite/settings.py.这是一个普通的python模块,其中模块 ...
- 编写你的第一个django应用程序4
本教程上接教程3,我们将继续开发网页投票应用,本部分将主要关注简单的表单处理以及如何对代码进行优化 写一个简单的表单 让我们更新一下在上一个教程中编写的投票详细页面的模板(‘polls/detail. ...
- 编写你的第一个django应用程序3
这一篇从教程第2部分结尾的地方继续讲起.我们将继续编写投票应用,并且专注于如何创建公用界面--也被称为视图 概况 django视图概念是一类具有相同功能和末班的网页的集合,比如,在一个博客应用中,你可 ...
- Django教程:第一个Django应用程序(3)
Django教程:第一个Django应用程序(3) 2013-10-08 磁针石 #承接软件自动化实施与培训等gtalk:ouyangchongwu#gmail.comqq 37391319 #博客: ...
- Django 2.0.1 官方文档翻译: 编写你的第一个 Django app,第一部分(Page 6)
编写你的第一个 Django app,第一部分(Page 6)转载请注明链接地址 Django 2.0.1 官方文档翻译: Django 2.0.1.dev20171223092829 documen ...
- Django 2.0.1 官方文档翻译: 编写你的第一个 Django app,第五部分(Page 10)
编写你的第一个 Django app,第五部分(Page 10)转载请注明链接地址 我们继续建设我们的 Web-poll 应用,本节我们会为它创建一些自动测试. 介绍自动测试 什么是自动测试 测试是简 ...
- 第一个Django应用程序_part3
一.概述 此文延续第一个Django应用程序part2. 官方文档:https://docs.djangoproject.com/en/1.11/intro/tutorial03/ view是Djan ...
- 编写你的第一个Django应用
安装 Python 作为一个 Python Web 框架,Django 需要 Python.更多细节请参见 我应该使用哪个版本的 Python 来配合 Django?. Python 包含了一个名为 ...
- 搭建你的第一个Django应用程序
首先你要确保你机器上面安装了python:Python开发_python的安装 python的相关学习资料:http://www.cnblogs.com/hongten/tag/python/ 其次, ...
- Django教程:第一个Django应用程序(4)
Django教程:第一个Django应用程序(4) 2013-10-09 磁针石 #承接软件自动化实施与培训等gtalk:ouyangchongwu#gmail.comqq 37391319 #博客: ...
随机推荐
- [密码管理/信息安全] KeePass Java 客户端 : KeePassJava2
序:续<KeePass:密码管理工具> [密码管理/信息安全] 密码管理工具:KeePass vs LastPass vs 1Password - 博客园/千千寰宇 [推荐] 概述 Kee ...
- 封装的DynamicCRM平台中最实用的JS工具类
包含了一个遮罩层的使用对象和一个通用的CRM平台JS操作对象. 使用示例: 常用的比如去除页面查找字段guid的'{}':commonUtil.delBrackets(commonUtil.getLo ...
- Solution -「POI 2013」LAB-Maze
\(\mathscr{Description}\) Link. 构造一个边平行与坐标轴, 顶点是整点, 相邻边互相垂直, 且逆时针遍历顶点时转向 (向左或向右) 符合给定字符串的不自交多边形. ...
- SpringBoot整合Netty+WebSocket
SpringBoot整合Netty+WebSocket 构建环境 pom.xml <?xml version="1.0" encoding="UTF-8" ...
- Mongodb使用手册-文档存储
简介 MongoDB 是一个基于分布式文件存储的NoSQL数据库 由C++语言编写,运行稳定,性能高 旨在为 WEB 应用提供可扩展的高性能数据存储解决方案 查看官方网站 MongoDB特点 模式自由 ...
- 深入解析 Spring AI 系列:解析函数调用
我们之前讨论并实践过通过常规的函数调用来实现 AI Agent 的设计和实现.但是,有一个关键点我之前并没有详细讲解.今天我们就来讨论一下,如何让大模型只决定是否调用某个函数,但是Spring AI ...
- 常见的HTML特殊字符:对钩与叉号,五角星
表示"对钩","叉号"的特殊转义符号汇总: 对钩符号 编码 描述 叉号符号 编码 描述 ✓ ✓ CHECK MARK 手写体对钩(细) ✗ ✗ BALLOT X ...
- 060_面向过程和面向对象区别 061_对象是什么_对象和数据管理 062_对象和类的关系_属性_成员变量_方法 063_一个典型类的写法和调用_类的UML图入门 064_内存分析详解_栈_堆_方法区_栈帧_程序执行的内存变化过程
060_面向过程和面向对象区别 061_对象是什么_对象和数据管理 062_对象和类的关系_属性_成员变量_方法 public class SxtStu {//定义了一个类,包含的成员变量,属性,方法 ...
- 类的加载与ClassLoader的理解
加载:将class文件字节码内容加载到内存中,并将这些静态数据转换成方法区的运行时数据结构,然后生成一个代表这个类的java.lang.Class对象,作为方法区中类数据的访问入口(即引用地址).所 ...
- ZenPhoto pg walkthrough Intermediate
nmap nmap -p- -A -sS 192.168.128.41 Starting Nmap 7.94SVN ( https://nmap.org ) at 2025-01-13 07:17 U ...