我想用Bootstrap内联显示一个列表。是否有一个类我可以添加从Bootstrap来实现这一点?
当前回答
根据Bootstrap文档，你需要将类'inline'添加到列表中;是这样的:
<ul class="inline">
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
然而，这并不管用，因为在引导CSS文件中似乎缺少一些CSS引用类“内联”。因此，另外，添加以下行到你的CSS文件，使其工作:
ul.inline > li, ol.inline > li {
display: inline-block;
padding-right: 5px;
padding-left: 5px;
}
其他回答
根据Bootstrap文档，你需要将类'inline'添加到列表中;是这样的:
<ul class="inline">
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
然而，这并不管用，因为在引导CSS文件中似乎缺少一些CSS引用类“内联”。因此，另外，添加以下行到你的CSS文件，使其工作:
ul.inline > li, ol.inline > li {
display: inline-block;
padding-right: 5px;
padding-left: 5px;
}
我惊讶，列表内联不是在bootstrap 4，然后最后我得到了它在bootstrap 4文档。
引导3和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/内联
引导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>
内联实际上不是我们可能需要的内联——即display:内联
Bootstrap内联到目前为止，我的观察者是一个水平方向
为了与其他元素内联显示列表，我们需要
display: inline; added to the UL
<ul class="unstyled inline" style="display:inline">
NB//添加到样式表
