我想用Bootstrap内联显示一个列表。是否有一个类我可以添加从Bootstrap来实现这一点?
当前回答
2.3.2引导
<ul class="inline">
<li>...</li>
</ul>
引导3
<ul class="list-inline">
<li>...</li>
</ul>
引导4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
来源:http://v4-alpha.getbootstrap.com/content/typography/内联
更新链接https://getbootstrap.com/docs/4.4/content/typography/#inline
引导5.倍
<ul class="list-group list-group-horizontal">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
</ul>
来源:https://getbootstrap.com/docs/5.0/components/list-group/水平 和https://getbootstrap.com/docs/5.2/components/list-group/ #水平
其他回答
引导5:
<ul class="list-group list-group-horizontal">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
</ul>
我在bootstrap.css文件中找不到任何特定的东西。因此，我将css添加到自定义css文件中。
.inline li {
display: inline;
}
这个解决方案使用Bootstrap v2，但是在TBS3中使用INLINE类。我还没有弄清楚ts3中等效的类是什么(如果有的话)。
这位先生写了一篇关于v2和v3区别的很好的文章。
http://mattduchek.com/differences-between-bootstrap-v2-3-and-v3-0/
EDIT -使用CSS针对li元素来解决您的问题，如下所示
{ display: inline-block; }
在我的情况下，我的目标是UL，而不是LI
nav ul li { display: inline-block; }
来完成雷蒙德的回答
2.3.2引导
<ul class="inline">
<li>...</li>
</ul>
引导3
<ul class="list-inline">
<li>...</li>
</ul>
引导4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
来源:http://v4-alpha.getbootstrap.com/content/typography/内联
2.3.2引导
<ul class="inline">
<li>...</li>
</ul>
引导3
<ul class="list-inline">
<li>...</li>
</ul>
引导4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
来源:http://v4-alpha.getbootstrap.com/content/typography/内联
更新链接https://getbootstrap.com/docs/4.4/content/typography/#inline
引导5.倍
<ul class="list-group list-group-horizontal">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
</ul>
来源:https://getbootstrap.com/docs/5.0/components/list-group/水平 和https://getbootstrap.com/docs/5.2/components/list-group/ #水平
