Question

我想在这张照片https://s1.postimg.org/1u8qkhey4v/Untitled-1.png

中做点什么

我试着做类似的事情，但我更好奇我怎么能在他们之间做那条水平线

这是我的代码：

 <div class="container">
      <div class="row">
        <div class="col-md-6">
            <div class="col-md-4">

                <a href="#"><img class="item1"  src="img/item1.png" alt="item1"></a>
                <a href="#"><img class="item1"  src="img/item1.png" alt="item1"></a>              
             </div>
            <div class="col-md-8">
                <h2 class="title">LOREM IPSUM DOLOR</h2>
                <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec lectus felis. Sed nec dignissim felis, id tempor turpis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>


                <h2 class="title">LOREM IPSUM DOLOR</h2>
                <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec lectus felis. Sed nec dignissim felis, id tempor turpis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>

            </div>

        </div>
        <div class="col-md-6">
          <div class="col-md-4">
              <a href="#"><img class="item1"  src="img/item1.png" alt="item1"></a>
              <a href="#"><img class="item1"  src="img/item1.png" alt="item1"></a>             
          </div>
          <div class="col-md-8">
              <h2 class="title">LOREM IPSUM DOLOR</h2>
              <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec lectus felis. Sed nec dignissim felis, id tempor turpis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>


              <h2 class="title">LOREM IPSUM DOLOR</h2>
              <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec lectus felis. Sed nec dignissim felis, id tempor turpis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>


          </div>
        </div>
      </div>
    </div>
  </div>

感谢。

Answer 1

您可以在div的底部添加边框。

.border-bottom {
   border-bottom: 1px solid #000;
}

然后将类边框添加到第一个col-md-6

<div class="col-md-6 border-bottom">
....
</div>

Bootstrap分频器问题

1 个答案: