减少行间距 [英] Reduce spacing between rows

问题描述

我正在使用Bootstrap网格系统。行之间的间距太大。

I am using Bootstrap grid system. The spacing between rows is too large.

如何减小它？

<div class="row">
  <div class="col-md-6">
    <h1 id="Heading"> Heading </h1>
    <div class="row" style="margin-left:6px;">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-12">
            <div id="rect"> <span id="Heading" style="margin-left:15px;font-weight:bold; font-size: 18pt;color: #2373B3;"> Span </span> </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div id="rect"> <span id="Heading" style="margin-left:15px;font-weight:bold; font-size: 18pt;color: #2373B3;"> Span  </span> </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div id="rect"> <span id="Heading" style="margin-left:15px;font-weight:bold; font-size: 18pt;color: #2373B3;"> Span  </span> </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div id="rect"> <span id="Heading" style="margin-left:15px;font-weight:bold; font-size: 18pt;color: #2373B3;"> Span  </span> </div>
          </div>
        </div>
      </div>
    </div>
  </div>
<div>

推荐答案

有2种快速解决方案：

1. 编辑引导程序核心css / sass，这将是一个坏主意，因为它会影响页面脚手架的核心功能。


2. 编写一个单独的类并将其添加到您的div中，例如：

.row-bottom -margin {margin-bottom：20px; }

.row-bottom-margin { margin-bottom:20px; }

，您可以将其用作

<div class="row row-bottom-margin">

不建议使用选项1，除非您确实希望在所有相关方面应用此更改放置并考虑您的未来设计。

Option 1 is not suggested until unless you are really looking for this change to be applied at all the relevant places and do consider your future designs.

希望这会有所帮助！

这篇关于减少行间距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！