Question

使用Bootstrap 3考虑以下HTML代码段：

<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">Project name</a>
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="./">Default <span class="sr-only">(current)</span></a></li>
        <li><a href="../navbar-static-top/">Static top</a></li>
        <li><a href="../navbar-fixed-top/">Fixed top</a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</nav>

有没有办法将上下文类，信息，成功等应用于这些 li 元素？

如果我尝试添加，文字颜色不会改变。

Answer 1

将文本包装在span元素中，如引导文档中所述。

Helper classes

处理特异性 由于另一个选择器的特殊性，有时不能应用强调类。在大多数情况下，一个充分的解决方法是将文本包装在＆lt; span＆gt;中。与班级。

＆＃13;

@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css');

＆＃13;

<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">Project name</a>
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="./"><span class="text-danger">Default</span> <span class="sr-only">(current)</span></a></li>
        <li><a href="../navbar-static-top/"><span class="text-success">Static top</span></a></li>
        <li><a href="../navbar-fixed-top/">Fixed top</a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</nav>

＆＃13;

将上下文类应用于导航栏

1 个答案: