python - 从 Flask 生成(内联 CSS)HTML 模板不起作用
问题描述
对于个人网站,我想使用flask为我的起始页面随机选择一张背景图片(共4张)。当尝试创建 HTML 模板(使用内联 CSS 进行格式化)时,生成的 HTML 不会显示随机选择的图片。
到目前为止,我已经尝试使用 url_for(),因为我认为问题可能是 jinja 找不到文件,但这并不能解决我的问题。
我还查看了空格和分隔符,这在我看来似乎是正确的。
我的 app.py 中的代码:
flask import Flask, render_template
import random
app = Flask(__name__)
@app.route('/')
def index():
intt = random.randint(1, 4)
random_number = ("../Images/artwork/{}.jpeg".format(intt))
return render_template('index.html', random_number=random_number)
我的 HTML 文件中的代码:
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@font-face {
font-family: "Pretoria Gross";
src: url("../Fonts/Pretoria.ttf");
}
ge {
color: Yellow;
font-family: Pretoria Gross;
font-size:70px;
text-align: center;
display:inline-block;
position:relative;
width:100%;
background: url('../Images/artwork/{{random_number}}.jpeg') no-repeat top center;
background-position: center top;
background-size: 25% auto;
}
</style>
<a href="about.html">
<ge>Website<br/>Title<br/>here</ge>
</a>
生成的 HTML 不会呈现 CSS。我哪里错了?非常感谢
解决方案
random_number
已经在存储所需的路径。url
css中的变化:
background: url('{{random_number}}') no-repeat top center;
或者,您可以简单地传递intt
给模板,并保留原始 css 模板:
return render_template('index.html', random_number=intt)
推荐阅读
- flutter - 无法将图像拖放到android studio中的图像文件夹
- php - mysqli_insert_id() 返回 0 但插入数据
- c++ - C++ 程序使用不同的编译器改变行为
- r - 在forestplot中,设置字体,使文本“普通”,不起作用,为什么?
- python - find_elements_by_xpath 递归调用后返回 None
- reactjs - AsyncSelect 不会更改加载消息,也不会更改选项消息(反应选择库)
- python - Redis 返回“无”作为结果
- firebase - componentDidUpdate() 在状态改变时更新,即使不在状态
- php - Laravel 7 中不存在命令“event:cache”?
- flutter - 我无法在 Liquidswipe 中实现 Connectivityresult