Menu
×
   ❮   
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

Django - 添加静态文件


创建静态文件夹

在构建 Web 应用程序时,您可能需要添加一些静态文件,例如图像或 CSS 文件。

首先,在您的项目中创建一个名为 static 的文件夹,与您创建 templates 文件夹的位置相同。

文件夹名称必须是 static

my_tennis_club
    manage.py
    my_tennis_club/
    members/
        templates/
        static/

static 文件夹中添加一个 CSS 文件,名称由您决定,在本例中我们将其命名为 myfirst.css

my_tennis_club
    manage.py
    my_tennis_club/
    members/
        templates/
        static/
            myfirst.css

打开 CSS 文件并插入以下内容

my_tennis_club/members/static/myfirst.css:

body {
  background-color: lightblue;
  font-family: verdana;
}

修改模板

现在您已经拥有一个 CSS 文件,其中包含一些 CSS 样式。下一步是将此文件包含到 HTML 模板中。

打开 HTML 文件并添加以下内容

{% load static %}

以及

<link rel="stylesheet" href="{% static 'myfirst.css' %}">

示例

my_tennis_club/members/templates/template.html:

{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myfirst.css' %}">
<body>

{% for x in fruits %}
  <h1>{{ x }}</h1>
{% endfor %}

</body>
</html>
运行示例 »

重新启动服务器以使更改生效

py manage.py runserver

在您的浏览器中查看结果:127.0.0.1:8000/testing/

不起作用?

只是测试?如果您只是想玩玩,并且不打算部署您的工作,您可以在 settings.py 文件中设置 DEBUG = True,上面的示例将起作用。

计划部署?如果您计划部署您的工作,您应该在 settings.py 文件中设置 DEBUG = False。上面的示例将失败,因为 Django 没有内置的解决方案来提供静态文件,但是有其他方法来提供静态文件,您将在下一章中学习这些方法。

示例(在开发中)

my_tennis_club/my_tennis_club/settings.py:

.
.
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
.
.

这将使示例起作用,但我们希望您选择 DEBUG = False,因为这是学习使用 Django 的最佳方式。


选择 Debug = False

在本教程的其余部分,我们将使用 DEBUG = False,即使在开发中也是如此,因为这是学习使用 Django 的最佳方式。

示例

my_tennis_club/my_tennis_club/settings.py:

.
.
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = False

ALLOWED_HOSTS = ['*']

.
.
ALLOWED_HOSTS

在使用 DEBUG = False 时,您必须指定哪些主机名可以托管您的工作。您可以选择 '127.0.0.1''localhost',它们都代表您本地计算机的地址。

我们选择 '*',这意味着任何地址都允许托管此网站。在您将项目部署到公共服务器时,应将其更改为真实的域名。


不起作用?

没错,示例仍然不起作用。

您需要安装一个第三方库来处理静态文件。

有很多选择,我们将向您展示如何在下一章中使用名为 WhiteNoise 的 Python 库。 下一章.



×

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail:
[email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail:
[email protected]

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Copyright 1999-2024 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.