容器内 Bootstrap 中带有图像的单个全角列的 css 最佳实践？答案

【问题标题】：Best practice in css for a single full-width column with image in Bootstrap inside a container?容器内 Bootstrap 中带有图像的单个全角列的 css 最佳实践？
【发布时间】：2018-04-13 14:20:36
【问题描述】：

对于这种内含图像的全角列（左列 - col1），最佳做法是什么？我需要它把它贴在左边距。 Col 2 必须有引导排水沟。

【问题讨论】：

引导程序 3 还是 4？
@JordiVicens Bootstrap4

标签： css twitter-bootstrap

【解决方案1】：

试试这个：

.padded-left {
  padding-left: 0;
}
.content {
  padding: 5% 0;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container-fluid">
  <div class="row">
    <div class="col-xs-6 col-sm-6 padded-left">
      <img class="img-responsive" src="https://images-na.ssl-images-amazon.com/images/I/51Le800MwaL.jpg"/>
    </div>
    <div class="col-xs-6  col-sm-6">
     <div class="content">
      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
      </div>
    </div>
  </div>
</div>

【讨论】：