我正在尝试制作以下HTML布局
如您所见,我有2行,第1行中的内容在Bootstrap Container类中缩进。在第2行中,我有2列分别具有背景颜色和图像,它们跨越整个屏幕。但是,它们中的文本再次缩进,类似于第1行中的内容。附加我尝试过的代码。
<div class="container" style="background: bisque;">
<div class="row">
<div class="col-xs-12">
<h1>Normal Boxed Width</h1>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-sm-6" style="background-color:lavender;">
<div class="row" >
<div class="container">
<h1>Left Panel</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae doloribus unde, distinctio a autem, soluta nulla similique. Vero natus deleniti, culpa consequuntur eveniet beatae laudantium in fuga mollitia sapiente! Assumenda!</p>
</div>
</div>
</div>
<div class="col-sm-6" style="background-color:aliceblue;">
<h1>Right Panel</h1>
</div>
</div>
</div>
我也试过这个link提供的解决方案,但这似乎不是正确的方法。如何实现上图所示的布局?