css - 面包屑栏右侧的引导文本

Question

我正在使用默认主题的 Bootstrap 3。我有面包屑使用:

<ol class="breadcrumb">
  <li><a href="#">Home</a></li>
  <li><a href="#">Library</a></li>
  <li class="active">Data</li>
</ol>

如何使文本在面包屑栏的右侧正确对齐？我在 Bootstrap 文档中找不到方法。

编辑:我不希望面包屑右对齐。我希望在栏的右侧显示一个单独的文本范围(因为这是一种浪费的空间)。

Answer 1

使用 Bootstrap 4.3 更新 2019

class="pull-right" 的解决方案不适用于 Bootstrap 4。我已经能够使用 ml-auto 将文本放在右边。

https://stackoverflow.com/a/51672730

  <ol class="breadcrumb">
    <li class="breadcrumb-item ml-3">
      <a href="#reserver">Réserver</a>
    </li>
    <li class="breadcrumb-item">
      <a href="#about">À propos</a>
    </li>
    <li class="breadcrumb-item">
      <a href="#horaires">Horaires</a>
    </li>
    <li class="breadcrumb-item">
      <a href="#avis">Avis</a>
    </li>
    <li class="ml-auto">Détails établissement</li>
  </ol>
</nav>