2016-12-24 12 views
0

私はcontainercontainer-fluidをNavbarベースのブートストラップに混ぜ込もうとしています。下に私のnavbarの写真を見ることができます。私が自分のブランドの右側にいることを望むリンク「戻る」があります(mdサイズまでのデバイスを使用する場合のみ)。ブートストラップnavbarコンテナとコンテナ流体の混合

My navbar

私はそれはこのようになりたい:

My navbar 2

そして、ここに私のコードは、(除外不要)しています。

<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <div class="container-fluid"> 
     <ul class="nav navbar-nav"> 
      <li><a href="#">< Return back</a></li> 
     </ul> 
    </div> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" 
        data-target="#navbar-collapse-1"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="home">MY WEBSITE</a> 
     </div> 
     ... 
    </div> 
</nav> 

これはどのように可能ですか?前もって感謝します。

+0

あなたはブランドとメインメニューの間にそれをしたいですか? –

+0

@mohamadfaramarzi、私は質問を編集し、例の写真を追加しました。 – lingo

+0

OK、私の回答を編集しました。もう一度plzを確認してください –

答えて

2

ブランドとナビバーの間に置いておきたい場合は、これは問題ありません。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
 
    <div class="container-fluid"> 
 
    <a class="navbar-brand" href="#"> 
 
     < Return back</a> 
 
     <div class="container"> 
 
      <div class="navbar-header"> 
 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1"> 
 
       <span class="sr-only">Toggle navigation</span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
      </button> 
 
      <a class="navbar-brand" href="home">MY WEBSITE</a> 
 
      </div> 
 
      ... 
 
     </div> 
 
    </div> 
 
</nav>

+0

いいえ、私はちょうどブランドと同じ場所に垂直にしたいです。 – lingo

+0

私にあなたが望むものの写真を与えてください。 –

+0

質問を編集しました。 – lingo

関連する問題