可以通过使用Bootstrap的CSS类来实现。以下是一个示例代码:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
table_data = [
{'name': 'John', 'age': 25, 'city': 'New York'},
{'name': 'Jane', 'age': 30, 'city': 'London'},
{'name': 'Tom', 'age': 35, 'city': 'Tokyo'}
]
return render_template('index.html', table_data=table_data)
if __name__ == '__main__':
app.run()
在上述代码中,我们定义了一个Flask应用,并在根路由中渲染了一个名为index.html
的模板。模板中使用了Bootstrap的CSS类来实现表格格式。
接下来,我们需要创建index.html
模板文件,并在其中使用Bootstrap的CSS类来定义表格格式。以下是一个示例代码:
<!DOCTYPE html>
<html>
<head>
<title>Flask Bootstrap Table</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h1>Flask Bootstrap Table</h1>
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>City</th>
</tr>
</thead>
<tbody>
{% for data in table_data %}
<tr>
<td>{{ data.name }}</td>
<td>{{ data.age }}</td>
<td>{{ data.city }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>
在上述代码中,我们引入了Bootstrap的CSS文件,并在表格中使用了Bootstrap的CSS类来定义表头和表格内容的样式。通过使用Flask的模板引擎,我们可以在模板中使用{% for %}
循环语句来遍历table_data
列表,并将数据填充到表格中。
这样,当访问Flask应用的根路由时,将会显示一个带有Bootstrap样式的表格,其中包含了table_data
列表中的数据。
请注意,以上代码仅为示例,实际应用中可能需要根据具体需求进行适当的修改和扩展。
新知·音视频技术公开课
云原生正发声
云+社区技术沙龙[第15期]
云+社区技术沙龙[第5期]
云原生正发声
云+社区技术沙龙[第28期]
腾讯云GAME-TECH游戏开发者技术沙龙
DB TALK 技术分享会
Elastic 中国开发者大会
领取专属 10元无门槛券
手把手带您无忧上云