首页 > 其他 > 详细

django初学教程 投票应用 06 添加样式和图片

时间:2021-09-05 20:17:50      阅读:11      评论:0      收藏:0      [点我收藏+]

https://docs.djangoproject.com/zh-hans/3.2/intro/tutorial06/

给投票应用添加样式和图片

除了服务端生成的HTML以外,网络应用通常需要一些额外的文件(比如图片、脚本和样式表)来帮助渲染网络页面,这些文件统称为“静态文件”。

django.contrib.staticfiles将各个应用的静态文件统一收集,便于分发。

自定义应用的界面和风格

在polls目录下创建static目录,类似template,在该目录下创建polls目录,在polls下创建style.css

Django 的 STATICFILES_FINDERS 设置包含了一系列的查找器,用于查找 static 文件。AppDirectoriesFinder 是默认查找器中的一个,它会在每个 INSTALLED_APPS 中指定的应用的子文件中寻找名称为 static 的特定文件夹,所以django可以以 polls/style.css 的形式引用此文件。

在样式表中添加超链接颜色(如绿色):

/* 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 %} 模板标签会生成静态文件的绝对路径。

重启服务器,载入:

技术分享图片

color设置为红色:

技术分享图片

添加一个背景图

polls/static/polls 目录下创建一个名为 images 的子目录,用于存放图像(如文件名为eg0.jpg)。

/* polls/static/polls/style.css */
body {
    background: white url("images/eg0.jpg") no-repeat;
}

浏览器重载 http://localhost:8000/polls/,背景图会出现在屏幕左上角(显示效果与图片大小有关):

技术分享图片

下一部分学习自定义 Django 自动生成后台网页。

django初学教程 投票应用 06 添加样式和图片

原文:https://www.cnblogs.com/ikventure/p/15228332.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!