我有一行,希望在该行的左侧显示图像,在该行的右侧显示文本。图像的高度应该与文本的高度相同。我的html如下所示:
<div class="container pt-3">
<div class="row pt-5 pb-5">
<div class="col-12 col-lg-6 order-lg-last">
<div class="text-start">
<h1 class="mx-auto mb-2">title...</h1>
<p style="text-align: justify !important">text...</p>
<p style="text-align: justify !important">text...</p>
</div>
</div>
<div class="col-12 col-lg-6">
<img
class="img-fluid"
src="../../../assets/img/participation.png"
alt="Participation"
/>
</div>
</div>
</div>
无论我怎么尝试,图像总是超过相邻列的高度,从而增加了行的高度。对此有什么解决办法吗?
2条答案
按热度按时间j2datikz1#
背景图像解决方案。
第一个
flvlnr442#
你可以这样试试。
HTML格式
CSS格式
图片来源:pixels.com