如何在引导中获得自动宽度列？

Question

如何像UIKit一样在引导中获得自动宽度列？

我需要5列自动宽度。

在UIKit中，您可以使用




Answer 1

这个问题的5栏方面已经在这里得到了回答

由于Bootstrap有12列，因此您只需将其中的10列与5个col-*-2单元一起使用

http://www.codeply.com/go/QXiPmtgJUJ

<div class="row">
    <div class="col-md-2 col-md-offset-1"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
    <div class="col-md-2"></div>
</div>

关于“自动宽度”，我不太清楚你的确切意思。Bootstrap 4将有新的自动布局列，这些列将占用任何行的剩余部分，但这仍然基于12列网格。

Answer 2

使用class=“col”将自动使列大小相等。

但如果您希望某些列根据其内容调整大小，请使用类似于class=“col auto”的方法。

使用class=“col-{breakpoint}-auto”类根据其内容的自然宽度调整列的大小。

参考：https://getbootstrap.com/docs/4.0/layout/grid/#variable-宽度内容

Answer 3

Bootstrap 4您可以单独使用coll类，它将根据可用空间调整大小。

<div class="row">
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
</div>