Html 我怎样才能稍微降低特色图片?
我怎样才能降低特色图片的比例,使其与标题保持一致? 这是一个网页 这是设置图像的代码Html 我怎样才能稍微降低特色图片?,html,css,flask,bootstrap-4,web-deployment,Html,Css,Flask,Bootstrap 4,Web Deployment,我怎样才能降低特色图片的比例,使其与标题保持一致? 这是一个网页 这是设置图像的代码 <div class="container"> <div class="jumbotron jumbotron-fluid mb-3 pl-0 pt-0 pb-0 bg-white position-relative"> <div class="h-100 tofront"> <div class="row justify-content-bet
<div class="container">
<div class="jumbotron jumbotron-fluid mb-3 pl-0 pt-0 pb-0 bg-white position-relative">
<div class="h-100 tofront">
<div class="row justify-content-between">
<div class="col-md-6 pt-6 pb-6 pr-6 align-self-center">
<p class="text-uppercase font-weight-bold">
<a class="text-danger" href="./category.html">{% block category %}{% endblock %}</a>
</p>
<h1 class="display-4 secondfont mb-3 font-weight-bold">{% block ptitle %} {% endblock %}</h1>
<p class="mb-3">
{% block desc %} {% endblock %}
</p>
<div class="d-flex align-items-center">
<img class="rounded-circle" src="{{url_for('static',filename='img/avatar.jpeg')}}" width="70">
<small class="ml-2">RahulVk<span class="text-muted d-block">{% block dtt %}{% endblock %}read</span>
</small>
</div>
</div>
<div class="col-md-6 pr-0">
<img src="{% block featuredImage %}{% endblock %}">
</div>
</div>
</div>
</div>
{%block ptitle%}{%endblock%}
{%block desc%}{%endblock%}
RahulVk{%block dtt%}{%endblock%}读取
我使用烧瓶作为后端。这就是标签存在的原因。我建议您在div中添加display flex,并将项目对齐到中心:
<div class="col-md-6 pr-0 d-flex align-items-center">
<img src="{% block featuredImage %}{% endblock %}">
</div>
或者您可以在顶部添加一些填充物:
<div class="col-md-6 pr-0 pt-4">
<img src="{% block featuredImage %}{% endblock %}">
</div>
我建议您在
行的类中添加align items center
类。正如@flpfar所建议的,您可以添加col-md-6
类,它将100%工作,但这不是直接的