django静态文件的引入与使用场景介绍
在django入门7:django动态数据与模板 课程中,我们从后台获取了一个用户列表,这个列表用了bootrap框架的table样式,但如果我们想在项目中引入自己定义的css或者image图片,就需要引入静态文件,以前别的语言开发的项目引入静态文件的引入方法很简单,如下。
//引入css <link rel="stylesheet" href="static/css/myCss.css"> //引入image图片 <img src="static/images/cat.png">
但是今天在python的django项目中是不能直接这样引入静态文件的,那该怎么办呢?
第一步:在blog模块下定义一个static的文件夹(必须这个名字),然后随便新建一个css文件夹和一个images文件夹,然后放入一个图片和自定义的css文件,如图所示。

第二步:在需要添加静态文件的html网页头部第一行加入如下django标签。
{% load staticfiles %}
<!DOCTYPE html>第三步:在head标签中引入我们自定义的myCss,static为固定写法,后面的为css的路径,如下。
<head>
<link rel="stylesheet" href="{% static 'css/myCss.css'%}">
</head>如果是图片视频等其他文件可以直接在src中引入,以图片为例,用法如下所示。
<img src="{% static 'images/third.png' %}">完整使用方法:例如我要将我们上一节中的用户列表头部设置背景颜色,在myCss.css中加入我们自己的style,如下。
#headcolor{
background-color: orange;
}然后把user_list.html改成如下这样。
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户列表页</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="{% static 'css/myCss.css'%}">
</head>
<body>
<table style="width: 500px">
<tr id="headcolor">
<td>ID</td>
<td>用户名</td>
<td>密码</td>
<td>电话</td>
<td>住址</td>
<td>操作</td>
</tr>
{% for user in users %}
<tr>
<td>{{ user.id }}</td>
<td>{{ user.username }}</td>
<td>{{ user.password }}</td>
<td>{{ user.phone }}</td>
<td>{{ user.address }}</td>
<td><a href="{% url 'user_detail' pk=user.id %}">查看</a>
<a href="{% url 'user_edit' pk=user.id %}">修改</a></td>
</tr>
{% endfor %}
</table>
</body>
</html>注意点:加入静态文件之后,django的运行命令要改成如下这样,否则只有在在debug模式下才会有效,而在正式生产环境下引入的静态文件会失效,
python manage.py runserver --insecure #用了静态文件需要用此方法运行项目 python manage.py runserver #以前的,正式环境不能加载静态文件
运行效果如图所示,有了自己自定义的背景颜色。
