如何在引导网格列之间给出间距

Question

我正在使用代码笔网站进行快速预览并使用它的引导程序可能是版本3

<div class="container-fluid">
  <div class="jumbotron">
    <h1 class="text-center">Mohandas Karamchand Gandhi</h1>
    <h2 Class="text-center text-muted">Mahatma Gandhi</h2>
    <div class="img-thumbnail img-fluid text-center"><img src="http://school.eckovation.com/wp-content/uploads/2017/03/gandhi.jpg" width="1415px">
      <div class="caption"><em>Mahatma Gandhi was the primary leader of India’s independence movement and also the architect of a form of non-violent civil disobedience that would influence the world.</em></div> 
    </div>
    <br>

使用bootstrap的网格系统         

<div class="row">
         <div class="card col-md-4">
          <div class="card-body">
          <h4 class="card-title">Who Was Mahatma Gandhi?</h4>
          <p class="card-text">Mahatma Gandhi (October 2, 1869 to January 30, 1948) was the leader of India’s non-violent independence movement against British rule and in South Africa who advocated for the civil rights of Indians. Born in Porbandar, India, Gandhi studied law and organized boycotts against British institutions in peaceful forms of civil disobedience. He was killed by a fanatic in 1948.</p>
          </div>
        </div>

希望在此间隔

<div class="card col-md-4">
        <div class="card-body">
          <h4 class="card-title">Religion and Beliefs</h4>
          <p class="card-text">Gandhi grew up worshiping the Hindu god Vishnu and following Jainism, a morally rigorous ancient Indian religion that espoused non-violence, fasting, meditation and vegetarianism.

During Gandhi’s first stay in London, from 1888 to 1891, he became more committed to a meatless diet, joining the executive committee of the London Vegetarian Society, and started to read a variety of sacred texts to learn more about world religions.

Living in South Africa, Gandhi continued to study world religions. “The religious spirit within me became a living force,” he wrote of his time there. He immersed himself in sacred Hindu spiritual texts and adopted a life of simplicity, austerity, fasting and celibacy that was free of material goods.</p>
        </div>
      </div>

希望在此间隔

<div class="card col-md-4">
        <div class="card-body">
        <h4 class="card-title">Gandhi’s Ashram & the Indian Caste System</h4>
        <p class="card-text">
          In 1915 Gandhi founded an ashram in Ahmedabad, India, that was open to all castes. Wearing a simple loincloth and shawl, Gandhi lived an austere life devoted to prayer, fasting and meditation. He became known as “Mahatma,” which means “great soul.”

In 1932, Gandhi, at the time imprisoned in India, embarked on a six-day fast to protest the British decision to segregate the “untouchables,” those on the lowest rung of India’s caste system, by allotting them separate electorates. The public outcry forced the British to amend the proposal.
        </p>
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

Bootstrap 4具有指定here

的间距控制类

您可以使用此类ml-2将margin left设置为0.5rem。号码可以是：

• 0：margin-left：0;
• 1：margin-left：0.25rem;
• 2：margin-left：0.5rem;
• 3：margin-left：1rem;
• 4：margin-left：1.5rem;
• 5：margin-left：3rem;

还有其他间距控制，例如

• mt for margin-top
• pt for padding-top .....

Answer 2

可能需要使用它的边距和填充的快速解决方案是尝试在mid元素上添加边框。要做到这一点，你将不得不：

• 创建一个$( document ).ready()类，如：

  CSS

然后你必须将这个类只添加到mid div中。

虽然，我不得不再次提到，这可能不是最好的解决方案，因为它需要大量的CSS修改。同样适合您想要的空间，您可以将边框颜色设为透明，或者只添加.sideborder{ border-left: 2px solid black; border-right: 2px solid black; }＆amp; padding-left到你的mid div。