如何用python写一个静态页面

原创

mob64ca12ec3a08 2024-03-03 05:28:12 ©著作权

文章标签 静态页面 Python html 文章分类 Python 后端开发

©著作权归作者所有：来自51CTO博客作者mob64ca12ec3a08的原创作品，请联系作者获取转载授权，否则将追究法律责任

如何用Python写一个静态页面

在实际开发中，我们可能会遇到需要使用Python来写一个静态页面的需求。本文将介绍如何使用Python来写一个简单的静态页面，并提供代码示例。

问题描述

假设我们需要制作一个展示产品销售情况的静态页面，页面内容包括产品销售额的饼状图和销售趋势的甘特图。我们希望使用Python来生成这个静态页面。

解决方案

为了解决这个问题，我们可以使用Python的Flask框架来搭建一个简单的web应用，然后在应用中使用模板引擎来渲染静态页面。下面是具体的步骤：

步骤一：安装Flask

首先，我们需要安装Flask框架。可以使用pip来安装Flask：

pip install Flask

步骤二：创建Flask应用

接下来，我们创建一个Flask应用，并编写一个简单的路由来渲染静态页面。假设我们的静态页面内容保存在一个名为index.html的文件中。

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run()

步骤三：编写静态页面

在Flask应用的根目录下创建一个名为templates的文件夹，并在文件夹中创建index.html文件。在index.html文件中编写用于展示产品销售情况的内容，包括饼状图和甘特图。这里我们使用mermaid语法来生成饼状图和甘特图。

<!DOCTYPE html>
<html>
<head>
    <title>Product Sales Dashboard</title>
</head>
<body>
    Product Sales Dashboard
    
    <h2>Pie Chart</h2>
    <div class="mermaid">
    pie
        title Product Sales
        "Product A" : 30
        "Product B" : 50
        "Product C" : 20
    </div>
    
    <h2>Gantt Chart</h2>
    <div class="mermaid">
    gantt
        title Product Sales Trend
        
        section Product A
        task A1 : 2022-01-01, 2022-01-15
        task A2 : 2022-02-01, 2022-02-15
        
        section Product B
        task B1 : 2022-01-05, 2022-01-20
        task B2 : 2022-02-10, 2022-02-25
        
        section Product C
        task C1 : 2022-01-10, 2022-01-25
        task C2 : 2022-02-15, 2022-03-01
    </div>
</body>
</html>