问答详情
源自：3-4 编程练习

导航条对不齐。。

spacer.gifspacer.gif

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Hello World</title>


<!-- Latest compiled and minified CSS -->

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

</head>


</head>


<body>

<nav class="navbar navbar-default">

    <div class="container">

         <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="bavbar-brand" href="#">某管理系统</a>

        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

        <ul class="nav navbar-nav">

            <li class="active"><a href="#">首页<span class="sr-only">(current)</span></a></li>

            <li class="dropdown">

                     <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">功能<span class="caret"></span></a>

          <ul class="dropdown-menu" role="menu">

                    <li><a href="#">业务功能</a></li>

                    <li class="diseabled"><a href="#">信息建立</a></li>

                    <li><a href="#">信息查询</a></li>

                    <li class="divider"</li>

                    <li><a href="#">系统功能</a></li>

                    <li><a href="#">设置</a></li>

                </ul>

                </li>

            <li><a href="#">帮助</a></li>

        </ul>

        <form class="navbar-form navbar-left" role="search">

        <div class="form-group">

          <input type="text" class="form-control" placeholder="用户名">

          <input type="password" class="form-control" placeholder="密码">

        </div>

        <button type="submit" class="btn btn-default">登录</button>

      </form>

        </div>

    </div>

</nav>


<script src=" http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script><!-- Latest compiled and minified JavaScript -->

<script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

</body>

</html>

spacer.gif


提问者：qq_慕设计7477373 2019-07-29 16:04

个回答

  • java初级开发
    2019-09-19 17:53:54

    然后再表单form里面添加分组就可以达到老师那种效果了

    0
  • java初级开发
    2019-09-19 17:53:15

    给你那个表单div去掉就好了

    0