html - 如何使用 bootstrap 分隔两个复选框？

Question

我正在尝试制作一个引导表单页面，但我在前端很烂。

我的问题真的很简单:如何将这些复选框隔开？

<div class="form-group">
    <label for="">Repetir?</label>
    <div class="form-check">
         <input type="checkbox" class="form-check-input" id="segunda">
         <label class="form-check-label">Segunda</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Terça</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Quarta</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Quinta</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Sexta</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Sábado</label>

          <input type="checkbox" class="form-check-input" id="segunda">
          <label class="form-check-label">Domingo</label>
      </div>
 </div>

这是结果的图像:

他们离得很近。谢谢

Answer 1

您可以使用左边距 (ml-x)、右边距 (mr-x) 或左边距 (pl-x) , 填充右 (pr-x) 类的 bootstrap-4 或 alpha。其中 x 是任意数字(1、2、3 等)。

例如pl-1 或 pr-2

Refer here

使用 bootstrap-3，您可以编写自己的简单类:

.ml-1 {
  margin-left: 4px !important;
}