如何在Bootstrap中像在UIKit中一样获得自动宽度列？我需要5列自动宽度。在UIKit中，您可以通过<div class="uk-width-1-5">获得它
<div class="uk-width-1-5">
yr9zkbsy1#
Bootstrap 4+你可以单独使用col类，它会根据可用空间调整大小。
<div class="row"> <div class="col"></div> <div class="col"></div> <div class="col"></div> <div class="col"></div> <div class="col"></div> </div>
9rnv2umw2#
使用class="col"将自动使列大小相等。但是如果你想让一些列根据它的内容来调整大小，可以使用类似class="col-auto"的东西。使用class="col-{breakpoint}-auto"类根据列内容的自然宽度调整列的大小。参考：https://getbootstrap.com/docs/4.0/layout/grid/#variable-width-content
class="col"
class="col-auto"
class="col-{breakpoint}-auto"
fumotvh33#
Bootstrap 5（2023年更新）
Bootstrap 5仍然使用flexbox网格，因此仍然可以使用.col到.col-auto类自动调整大小，以便列根据需要占用尽可能多的空间。
.col
.col-auto
Bootstrap 4
Bootstrap 4使用了一个flexbox网格，所以自动宽度列是使用col和/或col-auto类来实现的。col类将创建等宽列，而col-auto列将缩小以适应其内容的宽度。
col
col-auto
Bootstrap 3（原始答案）
这个问题的5列方面是answered here。由于Bootstrap有12列，所以您只使用其中的10列和5个col-*-2单位http://codeply.com/go/QXiPmtgJUJ在“自动宽度”方面，Bootstrap 4将具有新的自动布局列，这些列将占用任何行的剩余部分，但这仍然基于12列网格。
3条答案
按热度按时间yr9zkbsy1#
Bootstrap 4+你可以单独使用col类，它会根据可用空间调整大小。
9rnv2umw2#
使用
class="col"将自动使列大小相等。但是如果你想让一些列根据它的内容来调整大小，可以使用类似
class="col-auto"的东西。使用
class="col-{breakpoint}-auto"类根据列内容的自然宽度调整列的大小。参考：https://getbootstrap.com/docs/4.0/layout/grid/#variable-width-content
fumotvh33#
Bootstrap 5（2023年更新）
Bootstrap 5仍然使用flexbox网格，因此仍然可以使用
.col到.col-auto类自动调整大小，以便列根据需要占用尽可能多的空间。Bootstrap 4
Bootstrap 4使用了一个flexbox网格，所以自动宽度列是使用
col和/或col-auto类来实现的。col类将创建等宽列，而col-auto列将缩小以适应其内容的宽度。Bootstrap 3（原始答案）
这个问题的5列方面是answered here。由于Bootstrap有12列，所以您只使用其中的10列和5个col-*-2单位
http://codeply.com/go/QXiPmtgJUJ
在“自动宽度”方面，Bootstrap 4将具有新的自动布局列，这些列将占用任何行的剩余部分，但这仍然基于12列网格。