我的 HTML 有<section id="banner">，CSS 有#banner { padding: 12em 0 10em 0; background-image: url({{ url_for('static',filename = '../images/banner.jpg')}}); background-size: cover; background-position: top; background-attachment: fixed; background-repeat: no-repeat; text-align: center; border-top: 0.5em solid #5385c1; }还有更多@media 的东西。但由于某些问题，图像无法加载。这里出了什么问题？其他一切都正常。使用拍摄的 HTML 图像<img正在工作。如何通过CSS在flask应用程序中导入图像？我的文件结构是应用程序->模板，静态。，静态->CSS，图像。, 模板-> .html , CSS> .CSS
2 回答
阿波罗的战车
TA贡献1862条经验 获得超6个赞
.css我猜你正在包含静态目录中文件中的 CSS 。Jinja2 不处理这些静态文件。
如果您希望避免将此 CSS 块放入 HTML 模板中，那么最好的选择是将此 URL 硬编码到 CSS 文件中：
background-image: url('/static/path/to/background.jpg');我使用 CSS 为其赋予了一些功能。
尽管您可以尝试在模板中定义一个单独的 CSS 块，该块仅将background-image声明分配给#banner，而其余声明则在.css文件中定义（然后测试您的“功能”）...
<style type='text/css'>
#banner
{
background-image: url({{ url_for('static',filename = '../images/banner.jpg')}});
}
</style>
慕斯709654
TA贡献1840条经验 获得超5个赞
所有图像仅使用 render_template() 渲染，因此图像必须通过 *.html 文件渲染。因此，在 html 中导入图像后，问题就解决了。内联 CSS 完成了工作。
- 2 回答
- 0 关注
- 38 浏览
添加回答
举报
0/150
提交
取消