Html 如何使用引导程序处理此映像？

如何使用引导程序处理此图像？

这是我的代码这代码有什么错误请帮助我

 <div class="row">
     <div class="img-5">
         <div class="col-md-4">
             <div class="hn-img-1">
                 <img src="img/1.jpg" alt="">
             </div>
         </div>
         <div class="col-md-4">
             <div class="hn-img-1">
                <img src="img/2.jpg" alt="">
             </div>
         </div>
         <div class="col-md-4">
             <div class="hn-img-1">
                 <img src="img/3.jpg" alt="">
             </div>
         </div>
         <div class="col-md-4">
             <div class="hn-img-1">
                 img src="img/5.jpg" alt="">
              </div>
          </div>
          <div class="col-md-4">
             <div class="hn-img-1">
                 <img src="img/4.jpg" alt="" class="mt-top">
             </div>
          </div>
     </div>
 </div>

img src=“img/5.jpg”alt=”“>

结果是,

这是我的代码结果。

---

在下，您应该删除，因为在下一行中，您应该通过使用col sm-*或col md之类的类，只使用网格中您想要的内容-*

---

如果您想在网格中当前div之前留出空白，还可以使用.col md offset-*之类的类。

引导将屏幕划分为12列，一行只能有3列md-4。在第一列中放置2个图像，在中间列中放置大图像并在最后一列中保留两个图像。

可以使用嵌套行来创建所需的结构。这是一个示例代码，可以引导您实现所需的设计

<div class="row">
    <div class="col-md-4">
        <div class="row">
            <div class="col-md-12">
                <div class="well">2</div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="well">4</div>
            </div>

        </div>
    </div>
    <div class="col-md-4">
        <div class="well">1
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
        </div>
    </div>
    <div class="col-md-4">
        <div class="row">
            <div class="col-md-12">
                <div class="well">2</div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="well">4</div>
            </div>

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

2.
4.
1.










2.
4.

---

引导程序有一个12列网格系统。所以你应该以这样的方式划分你的网格，网格的总和是12

错误：您使用的是5个div

col-md-4

，每个网格有4个网格。这意味着你的网格总数是20。但是，它应该是12。在某些情况下，大于12的网格之和可能只起作用（使用

col sm-*

）。但强烈建议使用12格系统

所以你应该做的是：

不要使用5

col-md-4

，而应仅使用3

col-md-4

（网格总数=12）

您应该在第一个分区（左分区）中放置2个图像，在第二个分区（中央分区）中放置1个图像，在第三个分区（右分区）中放置其余2个图像

这应该能奏效。这是我的建议。（因为

md

代表中型设备，所以我们与列div元素通信的是，当可用屏幕空间等于或大于“中型设备”（992px及以上）时修改这些元素的宽度以匹配

md

类名中的列号。确保JSFIDLE中的输出窗口具有最大宽度以查看结果，否则所有图像将堆叠在另一个下面）

---

希望有帮助，如果您有什么问题，请告诉我。

查看此图像，了解有关网格的基本知识。使用网格布局根据需要分发页面。

---

我不明白，请给我举个例子谢谢