Html 引导3-2列具有相同的列高度，2个图像位于同一列中，一个图像与顶部对齐，一个与底部对齐

目标对齐：
|img1 | img2 |
|img1 | |
|img1 | |
|img1 | img3 |

css

html

---

因为您使用的是flexbox

.parent{
排名：0；
左：0；
右：0；
底部：0；
显示器：flex；
证明内容：之间的空间；
弯曲方向：立柱；
}
.项目{
/*高度：50px*/
保证金：5px；
背景：深蓝；
颜色：白色；
文本对齐：居中；
线高：50px；
字号：600；
}
.父母2{
显示器：flex；
}
.范例基础.家长{
显示器：flex；
弯曲方向：立柱；
}
.示例基础.项目{
宽度：200px；
}

弯曲
img1
img1
img1
img1
img2
img3

这是一支代码笔，

.row-eq-height {  /* For same column height */
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
}

<div class="container">
  <div class="row row-eq-height " >
    <div class="col-md-4" style="background-color:red">
      <img src="http://placehold.it/350x500" class="img-responsive"/> <!-- img1-->
    </div>
    <div class="col-md-4" style="background-color:green">
      <img src="http://placehold.it/150x150" style="vertical-align: top"/>  <!-- img2-->
      <img src="http://placehold.it/150x150" style="vertical-align: bottom"/>  <!-- img3-->
    </div>
  </div>
</div>