在一个网页中,不仅仅有html,还需要css、js、图片等,因此在DTL中加载静态资源是必须要解决的问题。
在DTL中,使用static标签来加载静态文件,要使用static标签,首先需要{% load static %}
加载静态文件的步骤如下:
1、首先确保django.contrib.staticfiles 已经添加到 settings.INSTALLED_APPS中(django最新版本不需要进行设置,设置后反而会提示:django.core.exceptions.ImproperlyConfigured: Application labels aren't unique, duplicates: staticfiles)
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'front',
'django.contrib.staticfiles'
]
2、确保在settings.py中设置了STATIC_URL (最新版本django已经默认添加了)
STATIC_URL='/static/'
3、在已经安装了的app下创建一个文件夹叫做static,然后再在这个static文件夹下创建一个当前app的名字的文件夹,
再把静态文件放在这个文件夹下。例如,你的app叫做book,有一个静态文件叫做tudou.jpg,那么路径为 book/static/book/tudou.jpg
4、如果有一些静态文件是不和任何app挂钩的,那么可以在settings.py中添加STATICFILES_DIRS,以后DTL会在这个路径中查找
静态文件。比如
STATICFILES_DIRS=[os.path.join(BASE_DIR,'static')]
5、在模板中使用load标签加载static标签,比如要加载在项目static文件夹下的style.css的文件,那么示例代码如下:
{% load static %}
<link rel=‘stylesheet’ href=“{% static ‘style.css’%}”>
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.nav{
overflow: hidden;
}
.nav li{
float:left;
list-style: none;
margin: 0 20px;
}
</style>
</head>
<body background="{% static 'front/lesser_cold.jpg' %}">
<ul class="nav">
<li><a href="/">首页</a></li>
<li><a href="{% url 'hospital' %}">医院</a></li>
</ul>
<p >
{% block content %}{% endblock %}
</p>
</body>
</html>