css - Bootstrap 4 : col same size as right col & image fill col

Question

在我的左边col我有一个 <img>在我的右边col我有一些文字。我要左边col与右侧高度相同col .然后我想要 <img>填补左边col .看起来很简单，但我做不到。这是我当前的代码:

                <div class="row">
                <div class="col-6 h-100">
                    <img class="img-fluid" src="@/assets/images/employee4.jpg">
                </div>
                <div class="col-6">
                    <h1 class="heading">HERREN</h1>
                    <hr>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                    <div class="row">
                        <h2 class="serivce">SCNHEIDEN</h2>
                        <h2 class="price float-right">18€</h2>
                    </div>
                </div>
            </div>

看起来像这样:

如你所见，左边col有右边的高度col而不是相反，图像不填充 `col``

有什么想法吗？

Answer 1

将该图像设置为左列的背景图像

CSS代码

#leftcol {
background-image:url("image url");
background-size:cover;

}