css - Bootstrap 4 - 内联列表？

Question

我将网站从 Bootstrap 4 alpha 6 迁移到 Bootstrap 4 Beta 1。

<ul class="nav navbar-nav list-inline">
  <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">FB</a></li>
  <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">G+</a></li>
  <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">T</li>
</ul>

现在，元素垂直对齐而不是水平对齐。如何使用 Bootstrap 4 beta 创建内联列表？

Answer 1

Bootstrap4

删除列表的元素符号并使用 .list-inline 和 .list-inline-item 这两个类的组合应用一些较轻的边距。

<ul class="list-inline">
   <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">FB</a></li>
   <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">G+</a></li>
   <li class="list-inline-item"><a class="social-icon text-xs-center" target="_blank" href="#">T</a></li>
</ul>