引导两列并排，一列全宽，另一列在包含文本的容器中

Question

我正在尝试实现这一输出

​

我想要显示此文本与红色框和红色框的意思与容器。右侧没问题，但左侧有问题..

我试过了

<style type="text/css"> 
.p-r {
    padding-right: 0;
    padding-left: 0;
    }</style>

<div class="container-fluid">

    <div class="row">

      <div class="col-md-6">
          <h1>SCANNING & DIGITIZATION</h1>
          <p>We are engaged in all forms of document digitization, image scan & data capture. From microfilm / microfiche and aperture card scanning, to automated invoice processing, through to large format scanning and everything in between. We process well over a million per pages a month on site or in our client’s offices. We have decades of experience, a highly knowledgeable staff and scalable capacity. With clients from virtually every industry, we are used to tight turnarounds and can provide the software, hardware, and manpower to assist with backfile conversion or document digitization, freeing you to concentrate on business.</p>
      </div>

      <div class="col-md-6 p-r">
        <img src=https://ask.qcloudimg.com/http-save/yehe-900000/4bfad9e0939d8cc48dae7e59ced3ddd8.jpeg class="img-responsive img-full">
      </div>

    </div>

  </div>

Answer 1

这就是你要找的东西吗：jsfiddle.net

.p-r:before {
 content: '';
 position: absolute;
 width: 200%;
 height: 100%;
 left: 0;
 bottom: 0;
 background: url(https://i.stack.imgur.com/zOGb2.jpg) no-repeat center;
 background-size: cover;
}