现在,我正在尝试将代码分解到Flask/Jinja应用程序中: #hp { height: 250px; width: 100%; background-color: gray; /* background: url(https://ununsplash.imgix.net/photo-1427348693976-99e4aca06bb9) no-repeat center center; */ background-size: cover;} <div id="hp" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#hp" data-slide-to="0" class="active"></li> <li data-target="#hp" data-slide-to="1"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner"> <!-- Wrap slides 1 --> <div class="item active"> <div style="background: url(https://ununsplash.imgix.net/photo-1427348693976-99e4aca06bb9) no-repeat center center / cover;"> </div> </div> <!-- Wrap slides 2 --> <div class="item"></div> </div> <!-- codes for Controls follows --></div>对于真实代码,我尝试了以下变体:<img src="{{url_for('.static', filename='img/works2_big.jpg')}}" class="center-block">和这个:<div style="background: url(../static/img/works2_big.jpg) no-repeat center center;"></div>我什至对此也持弹道态度.<div style="background: url({{url_for('.static', filename='img/works2_big.jpg')}}) no-repeat center center"></div>仍然没有显示.我使用的Flask蓝图的静态文件定义正确,并包含我的工作CSS和JS文件.main = Blueprint('main', __name__, template_folder='templates', static_folder='static')还有另一种方法可以正确地将此内联CSS插入Jinja吗?解决方案尝试一下:<img src="background-image: url({% static 'img/works2_big.jpg' %})" class="center-block">I'm having problem making the Bootstrap Carousel responsive and scaling height and width of dynamic images. One work around I found was to use: background: url(path_to_image.jpg) no-repeat center center; which seems to work okay.Now, I'm trying to factor the code into a Flask/Jinja application:#hp { height: 250px; width: 100%; background-color: gray; /* background: url(https://ununsplash.imgix.net/photo-1427348693976-99e4aca06bb9) no-repeat center center; */ background-size: cover;}<div id="hp" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#hp" data-slide-to="0" class="active"></li> <li data-target="#hp" data-slide-to="1"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner"> <!-- Wrap slides 1 --> <div class="item active"> <div style="background: url(https://ununsplash.imgix.net/photo-1427348693976-99e4aca06bb9) no-repeat center center / cover;"> </div> </div> <!-- Wrap slides 2 --> <div class="item"></div> </div> <!-- codes for Controls follows --></div>For the real code, I've tried the following variations:<img src="{{url_for('.static', filename='img/works2_big.jpg')}}" class="center-block">and this one:<div style="background: url(../static/img/works2_big.jpg) no-repeat center center;"></div>I even went ballistic on this one:<div style="background: url({{url_for('.static', filename='img/works2_big.jpg')}}) no-repeat center center"></div>still no show. I'm using a Flask blueprint with my static file well defined and contained my working css and js files.main = Blueprint('main', __name__, template_folder='templates', static_folder='static')Is there another way I can correctly insert this inline css into jinja? 解决方案 Try this:<img src="background-image: url({% static 'img/works2_big.jpg' %})" class="center-block"> 这篇关于内联CSS background:url()在Jinja2模板中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云! 08-13 02:47