Navbar li元素没有浮动到右边?

时间:2017-11-14 16:27:45

标签: twitter-bootstrap

我需要一个帮助,让我的li元素浮动到导航栏的右侧。

=IF(ISBLANK(K2),"",IF(K2<=J2,"Yes","No"))

2 个答案:

答案 0 :(得分:1)

如何在此方案中使用Grids

您将col-4的网格列为您的列表项和网格col-8到您的品牌名称。

通过这种方式,您将能够实现您的目标。

一点点CSS样式会让它变得更好。

.navbar-right{
  float:right;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet" />
<nav class="navbar navbar-toggleable-md navbar-fixed-top topnav col-12" role="navigation">
  <div class="navbar-header col-8">
    <a class="navbar-brand" href="#" target="_blank" id="heading">Samrat Luitel</a>
  </div>
  <div class="col-4">
    <ul class="nav navbar-nav navbar-right">
      <li class="nav-item"><a href="#home" style="color:black" class="nav-link">Home</a></li>
      <li class="nav-item"><a href="#home" style="color:black" class="nav-link">About Us</a></li>
      <li class="nav-item"><a href="#home" style="color:black" class="nav-link">Contact Us</a></li>
    </ul>
  </div>
</nav>

答案 1 :(得分:-1)

你的班级来自哪里?迫使它们向右浮动的最简单方法是在外部样式表或HTML文档中定义它。要在HTML中完成所有您需要做的是:

    <style>
    .navbar-nav>li {
        float: right;
    }
    </style>