一周学会Flask3 Python Web开发-Jinja2模版中加载静态文件

锋哥原创的Flask3  Python Web开发 Flask3视频教程:

2025版 Flask3 Python web开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili

一个Web项目不仅需要HTML模板,还需要许多静态文件,比如 CSS、JavaScript文件、图片以及音频等。在Flask程序中,默认我们需要将静态文件存储在与主脚本(包含程序实例的脚本)同级目录的static文件夹中。

在Jinja2模板引擎中,我们可以使用url_for()函数来加载静态资源。

我们来看一个示例:

首先在static目录下放css,js和一个图片文件。目录结构如下:

一周学会Flask3 Python Web开发-Jinja2模版中加载静态文件_第1张图片

css.css:

body {
    background-color: red;
}

javascript.js

alert("这个是哪吒!")

student.html目录,引入js和css文件:


以及加载图片:

加载静态文件

运行效果:

一周学会Flask3 Python Web开发-Jinja2模版中加载静态文件_第2张图片

你可能感兴趣的:(Flask3视频教程,python,flask,flask3)