在 Flask 中创建静态文件夹
通过这个解释，我们将学习如何在静态目录中使用静态资产或静态文件。我们还将学习如何将自定义 CSS 文件导入 Flask。
在 Flask 中创建静态文件夹
在 Flask 应用程序中，显示图像和加载自定义 CSS 类以及使用自定义 JavaScript 有一种奇怪的方式。所以，让我们继续开始吧。
由于我们是从头开始，我们将创建一个全新的项目。我们将从 Flask 中导入一些类，将模块写成小写，然后创建一个 app 对象。
from flask import Flask,render_template
app=Flask(__name__)
我们将创建一个名为 index() 的基本主页函数。我们将在单独的装饰器中设置两个根为 '/home' 和 '/'。
添加两个根的目的是向你展示我们可以在单个函数中使用多个 route()，这意味着这两个不同的路由都可以访问该函数。
我们将使用 return 关键字返回 render_template() 并传递 home.html 文件。
@app.route('/home')
@app.route('/')
def index():
return render_template('home.html')
要运行我们的应用程序，我们需要使用以下代码。
run() 方法将帮助运行 Flask 应用程序。我们必须传递 debug 等于 True，因为我们想看到调试，但是当你将站点带到生产级别时，你可以通过编写 False 来关闭它。
if __name__=='__main__':
app.run(debug=True)
现在，我们需要设置一个模板文件夹，我们将在其中放置所有 HTML 文件；为此，我们将创建一个新文件夹并将其命名为 templates。然后，我们需要创建另一个新文件夹，我们将其称为 static。
现在，我们可能已经能够知道我们将放置特定文件的位置。我们将进入 templates 文件夹并创建一个名为 base.html 的新文件，然后我们将创建一个名为 home.html 的新文件。
让我们在 base.html 文件中编写一个非常基本的 HTML 代码，在 head 中，我们将设置一个块标题，在 body 标签内，我们将添加另一个块内容。
Flask 应用程序为我们所有的 static 文件设置了默认值，这些文件将保存在名为 static 的文件夹中，这意味着你需要将此文件夹设为静态。现在，我们将引用我们想要的特定文件名；我们将把 {{ url_for('static',filename='style.css') }} 传递给 href 属性并在其周围加上双引号。
这样，我们将使用 link 标记中的 Python 代码来获取 static 文件夹的 URL，这将为我们提供 URL，然后指定确切的文件名。
<html>
<head>
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='style.css') }}">
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
现在，我们有了我们的 base 模板。让我们使用 home.html 文件中的 {% extends 'base.html' %} jinja 代码扩展这个 base 模板，并使用一些块来访问 base.html 元素。
{% extends 'base.html' %}
{% block title %}
Home Page
{% endblock %}
{% block content %}
<h1> Home Page</h1>
{% endblock %}
现在，我们将讨论在我们的 static 目录中创建一个 static 文件以及如何导入我们的自定义 CSS。我们需要在我们的 static 目录中创建一个新的 CSS 文件，并将其命名为 style.css；不管你怎么称呼它。
你可以更改文件名而不是扩展名，但请确保记住该名称。我们现在将在 style.css 文件中编写一个基本样式以保持简单。
我们将设置一个 CSS body 选择器，使用 color 属性，然后传递 crimson 颜色值。
body {color: crimson;}
我们完成了。现在，我们可以开始运行这个应用程序了。
from flask import Flask,render_template
app=Flask(__name__)
@app.route('/home')
@app.route('/')
def index():
return render_template('home.html')
if __name__=='__main__':
app.run(debug=True)
现在，打开网络浏览器，并导航到带有标题的主页。
Hello! I am Salman Bin Mehmood(Baum), a software developer and I help organizations, address complex problems. My expertise lies within back-end, data science and machine learning. I am a lifelong learner, currently working on metaverse, and enrolled in a course building an AI application with python. I love solving problems and developing bug-free software for people. I write content related to python and hot Technologies.
LinkedIn