Question

将导航栏放在导航栏的右侧，然后放置产品和其他菜单项，但使用下面的代码，它按照我需要的相反顺序显示它们

<form id="form1" runat="server" >
<div>
    <div class="navbar navbar-default navbar-fixed-top " role="navigation" >
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=" .navbar-collapse">
                    <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 navbar-right" href="Index.aspx"><span>
                    <img alt="Logo" src="Image/weather.png" height="30" /></span>Company name</a>
            </div>
            <div class="navbar-collapse collapse " >
                <ul class="nav navbar-nav navbar-right"  >         

                     <li class="active navbar-nav "><a href="Index.aspx">home</a></li>
                    <li><a href="#">products</a></li>
                     <li><a href="#">contacts</a></li>
                    <li><a href="#">users</a></li>
                </ul>
            </div>

        </div>

    </div>
</div>

Answer 1

我认为你想要实现的是这个 - 只需撤消<li >订单

即可

代码段

<html>
<head>
<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">
          <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>
           <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
           <style type="text/css">
            
           </style>
           </head>
           <body>
  <form id="form1" runat="server" >
<div>
    <div class="navbar navbar-default navbar-fixed-top " role="navigation" >
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=" .navbar-collapse">
                    <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 navbar-right" href="Index.aspx"><span>
                    <img alt="Logo" src="Image/weather.png" height="30" /></span>Company name</a>
            </div>
            <div class="navbar-collapse collapse " >
                <ul class="nav navbar-nav navbar-right"  >         

                     
                   
                    
                    <li><a href="#">users</a></li>
                     <li><a href="#">contacts</a></li>
                     <li><a href="#">products</a></li>
                    <li class="active navbar-nav "><a href="Index.aspx">home</a></li>
                </ul>
            </div>

        </div>

    </div>
</div>
</body>
  </html>

如何把家放在asp.net的导航栏的右侧

1 个答案: