html - 带有全宽图像的 Bootstrap 4 容器

Question

它不一定是 bootstrap 4。我被卡住了，需要帮助。试图将页面分为 2 个部分。左侧有全宽 bg 图像。这就是问题所在，需要 css 和 html 方面的帮助

我的 html 代码:

<div class=left-bg-img>
<div class="container">
<div class="col-sm-6">
<p>Left content goes here.</p>
</div>
<div/><!--left-bg-->

<div class="col-sm-6">
<p>Right content goes here.</p>
</div>
</div>

image example

Answer 1

嘿，我认为你需要添加一个类行来完美地划分你的内容:

<div class="row">
<div class="col-sm-6 bg"></div>
<div class="col-sm-6"></div>
</div>

如果你想在页面的左侧部分使用背景图片，只需使用:

background:url("your url of image");
background-size:cover;

这样就可以得到带背景图的左分区和完美分割的分区。