【问题标题】:Bootstrap spacing for columns [duplicate]列的引导间距[重复]
【发布时间】:2018-09-29 17:14:26
【问题描述】:

我正在尝试在我的引导列之间创建间距,但它似乎并没有自动完成。我需要将特定的方式或类添加到列中吗?

<div class="row row_padding">
 <div class="col-sm-4 text-center">
  <div class="col-sm-11">1</div>
 </div>
 <div class="col-sm-4 text-center">
  <div class="col-sm-11">2</div>
 </div>
 <div class="col-sm-4 text-center">
  <div class="col-sm-11">3</div>
 </div>
</div>

【问题讨论】:

标签: html css bootstrap-4


【解决方案1】:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row text-center bdr">
    <div class="col-xs-4 m-1 p-1 w-25 border border-secondary">#1</div>
    <div class="col-xs-4 w-25 m-1 p-1 border border-secondary">#2</div>
    <div class="col-xs-4 m-1 p-1 w-25 border border-secondary">#3</div>
  </div>
</div>

【讨论】:

  • 当应用列系统不再起作用时,我无法拥有三个“col-sm-4”而不将其放到新行上。
  • @AG_BOSS 你认为你已经成功应用了 CSS 吗?也让我们知道这个属性是什么top-margin: 25px;。我想知道这个答案是如何得到一票赞成的。
  • OP 希望每个之间有空间。只需为您的 div 应用边框并检查一下。
  • 请看一下这个截图 - imgur.com/a/fHDN15Q。我已经添加了代码,但我需要每个白色列之间的间距,这似乎仍然没有应用。
  • 它和你上面提供的完全一样,只是包含在一行中。
【解决方案2】:

我认为col-md-offset 或类似的课程对你有用。 :-)

【讨论】:

  • 我试过这个,但它对我不起作用。类是:col-md-offset-4
  • @Jordan col-md-offset 应该与您的列大小相匹配,假设您使用 col-xs-2 作为您的 div 列,那么您可以使用 col-xs-offset-4 或其他东西共 12 个。
  • @salmanwebdevelper 它应该是 col-md-offset-[1-12] 并且它在 xs、sm、md 和 lg 之间变化。 ;)
猜你喜欢
  • 2021-03-19
  • 2021-03-09
  • 2018-03-09
  • 2015-01-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多