css - 如何定位我的导航栏？

Question

我正在尝试学习 bootstrap，到目前为止它非常有趣。我一直在这个问题上停留了一段时间，我想将导航栏的空间设置为屏幕的五分之二。我认为如果以这种方式隔开它看起来会好得多，但我一直无法找到解决方案。我想知道是否有办法做到这一点。

<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container-fluid">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>                        
    </button>     
    <a class="navbar-brand" href="index.html"><strong>Website</strong></a>
  </div>
  <div class="collapse navbar-collapse" id="myNavbar">
    <ul class="nav navbar-nav">
      <li class="active"><a href="index.html">Home</a></li>
      <li><a href="products.html">Products</a></li>
      <li><a href="contact.html">Contact</a></li>
    </ul>
  </div>
  </div>
</nav>

Answer 1

您可以创建一个 css 类:

.adjust-margins-container{
    margin-left: 30%;
}

然后将类添加到:

<div class="container-fluid adjust-margins-container">

bootply example