Django(8)-静态资源引用CSS和图片

除了服务端生成的 HTML 以外,网络应用通常需要一些额外的文件------比如图片,脚本和样式表------来帮助渲染网络页面。在 Django 中,我们把这些文件统称为"静态文件"。

我们使用static文件来存放静态资源,django会在每个 INSTALLED_APPS 中指定的应用的子文件中寻找名称为 static 的特定文件夹

引用CSS样式

创建文件polls/static/polls/style.css

css 复制代码
li a {
    color: green;
}

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

html 复制代码
{% load static %}

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

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

引用图片

为图像创建一个子目录。 在 polls/static/polls/ 目录中创建 images 子目录。 在此目录中,添加您想用作背景的任何图像文件。

css 复制代码
body {
    background: white url("images/background.png") no-repeat;
}

将一张图片放在该文件夹下background.png

在样式表中添加对图像的引用(polls/static/polls/style.css

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

相关推荐
星空椰5 小时前
Python 面向对象高级:继承与类定义详解
开发语言·python
凯瑟琳.奥古斯特5 小时前
高阶子查询题目精炼
开发语言·数据库·python·职场和发展·数据库开发
风之所往_5 小时前
Python 3.4 新特性全面总结
python
太阳上的雨天6 小时前
任何格式的文件转Markdown
python·ai
yaoxin5211236 小时前
419. 现代 Java IO 最佳实践 - 写入文本文件
java·windows·python
weixin_468466857 小时前
纳米 AI 搜索新手极速上手指南
人工智能·python·深度学习·搜索引擎·ai·语言模型·自然语言处理
凯瑟琳.奥古斯特7 小时前
数据库原理选择题精选
数据库·python·职场和发展
彦为君7 小时前
JavaSE-07-异常机制
java·开发语言·后端·python·spring
适应规律8 小时前
【无标题】
人工智能·python·算法