ブートストラップを使用してメニューを作成していません

-3

ブートストラップを使用して応答メニューを作成しようとしました。しかし、私はこれをどのように実装するのか分かりません。ブートストラップを使用してメニューを作成していません

私の考えは、左側に1つのロゴがあり、右側のメニューにあるはずです。

以下は私のメニューです。見て、

それはブートストラップを使用して、上記の画像のようにメニューを作ることが可能です。あなたは完全なコードを掲示した場合、私は以下のコードを試してみました

、

<div class="menu"> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-sm-3 vcenter"> 
        <p><img src="<?php echo base_url("assets/images/logo.png"); ?>" alt="Logo" /></p> 
       </div> 
       <div class="col-sm-9 vcenter"> 
        <nav role="navigation" class="navbar navbar-default"> 
         <!-- Brand and toggle get grouped for better mobile display --> 
         <div class="navbar-header"> 
          <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle"> 
           <span class="sr-only">Toggle navigation</span> 
           <span class="icon-bar"></span> 
           <span class="icon-bar"></span> 
           <span class="icon-bar"></span> 
          </button> 
         </div> 
         <!-- Collection of nav links and other content for toggling --> 
         <div id="navbarCollapse" class="collapse navbar-collapse"> 
          <ul class="nav navbar-nav navbar-right"> 
           <li class="active"><a href="#">Home</a></li> 
           <li><a href="#">Profile</a></li> 
           <li><a href="#">Messages</a></li> 
          </ul> 
         </div> 
        </nav> 
       </div> 
      </div> 
     </div> 
    </div>

出典

2017-02-13 Jithin Varghese

ここを見て：http://getbootstrap.com/components/#navbar -default – pbenard

最初にドキュメントの例を使って試してみる必要があります。次に、特定の問題が発生した場合に再度尋ねます。 – ZimSystem

@ZimSystem：もう一度質問を確認してください。私は編集しました。 –

-1

---

がフルスクリーンを行く

<html> 
 
    <head> 
 
    <meta charset="UTF-8"> 
 
     <title>Secure Login</title> 
 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
      <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      
 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
     
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
    </head> 
 
    <body> 
 
     <nav class="navbar navbar-default"> 
 
    <div class="container-fluid"> 
 
    <!-- Brand and toggle get grouped for better mobile display --> 
 
    <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
 
     <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="#">Brand</a> 
 
    </div> 
 

 
    <!-- Collect the nav links, forms, and other content for toggling --> 
 
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
 
     
 
     
 
     <ul class="nav navbar-nav navbar-right"> 
 
     <li><a href="#">Company</a></li> 
 
     <li><a href="#">Services</a></li> 
 
     <li><a href="#">Technology</a></li> 
 
     <li><a href="#">Products</a></li> 
 
     <li><a href="#">Insights</a></li> 
 
     
 
    </div><!-- /.navbar-collapse --> 
 
    </div><!-- /.container-fluid --> 
 
</nav> 
 
</body> 
 
</html>

出典

2017-02-13 18:52:11 neophyte

私はdownvoteの理由を知ることができますか？ – neophyte

オールライトは私は知りませんが、あなたは、ブートストラップCSSとブートストラップJS（とjQuery）を含め、開始から始める必要があります。

Congrat's、Bootstrapそれは本当にクールで、私のような古い開発者にとっては天国です。あなたはそれを達成することができます。このように

出典

2017-02-13 18:01:51

ブートストラップを使用してメニューを作成していません

答えて

関連する問題