Django学习笔记007-模板加载静态资源

在一个网页中，不仅仅有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')]

扫描二维码关注公众号，回复： 4355391 查看本文章

5、在模板中使用load标签加载static标签，比如要加载在项目static文件夹下的style.css的文件，那么示例代码如下：

{% load static %}

{% 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>

Django学习笔记007-模板加载静态资源

猜你喜欢