Html 引导是否像简单网格一样对齐两个内容？

我已经为此工作了大约一个星期。我使用bootstrap在两列中对齐了两个类，并在内容下面创建了另一个单独的类。当我预览网页时，单独的类与这两个类对齐，而不是单独的类位于2列网格下面。如何将单独的类放置在两列引导网格下？下面是结果的图像以及使用的代码。谢谢

   <div class="prod_section">
   <div class="border col-md-6">
      <img src="help.jpg" class="word" alt="h">
      <h2 class="header">SHIRT</h2>
   </div>
   <div class="border col-md-6 ">
      <img src="img/help_two.jpg" alt="" class="word">
      <h2 class="header"> URBAN SHIRT</h2>
   </div>
</div>
<div class="seperate">Is BOOTSTRAP suppose to appear like this?</div>



.prod_section{
    margin:auto;
    width:1300px;
    margin-top:600px;
    margin-bottom: 600px;
}

.word{
    max-width:90%;
    /*box-shadow: 10px 10px 20px #bababa;*/
}

h2{
    font-family: 'Montserrat';
    font-weight:700;
}
.header{
    padding-top:20px;
}
body{
    background:white;
}

衬衫
城市衬衫
引导程序是这样出现的吗？
.prod_组{
保证金：自动；
宽度：1300px；
边缘顶部：600px；
边缘底部：600px；
}
.字{
最大宽度：90%；
/*盒影：10px 10px 20px#bababa*/
}
氢{
字体系列：“蒙特塞拉特”；
字号：700；
}
.标题{
填充顶部：20px；
}
身体{
背景：白色；
}

---

尝试将那些

col-md-6

放入

行中

<div class="row">
  <div class="col-md-6"></div>
  <div class="col-md-6"></div>
</div>

在引导中，您需要像这样启动div

<div class="container">
  <div class="row">
    <div class="col-md-6" id="one"><img src="http://lorempixel.com/400/200" class="word" alt="h">PIC A</div>
    <div class="col-md-6" id="two"><img src="http://lorempixel.com/400/200" alt="" class="word">Pic B</div>
  </div>

  <div class="row">
    <div class=" col-md-6 seperate"><img src="http://lorempixel.com/400/200">Is BOOTSTRAP suppose to appear like this? Div 3</div>
  </div>
</div>


图A
图B
引导程序是这样出现的吗？第3组

为了充分利用引导网格系统，您需要将所有内容包装在一个
行中，然后
行负责确保其中的所有内容都在同一个“行”中对齐，只要网格不超过12列。最后，您需要为每个div指定一个大小，即它们将占用多少列。1-12列。这里我们有3个div，每个div占据6列
。前两个
位于there own row内，共占12列，而最后的
则位于该行之外，但仍位于
div内，并创建一个新行
。然后，只需创建div并为它们指定列宽。这并不是一个完整的引导过程，而是一个简单的网格系统工作原理概述。继续阅读网站上有关引导的更多信息，引导4尚未发布，但alpha版本可以安全使用，我个人到目前为止还没有遇到任何问题。