Question

这里我正在尝试一个带有登录下拉列表的示例引导表单，用户名和密码，我包含下面的代码，当登录表单被激活时，表单浮出屏幕右侧的菜单，代码如下：

<div class="navbar  navbar-fixed-top">
        <div class="navbar-inner">
            <div class="container-fluid">
                <a class="btn btn-navbar" data-toggle="collapse" data-target="nav-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <a href="#" class="brand" title="">
                Test
                </a>

      <ul class="nav nav-pills pull-right">

         <li>
           <form class="input-append" method="GET" action="/search" style="margin-top:4px;margin-bottom:5px;">
             <input type="text" title="Enter keyword(s) to find" id="TT" name="TT" class="span2" maxlength="40">
               <button type="submit" class="bton">
                 <i class="icon-search" title="Search"></i>
               </button>
           </form>&nbsp;&nbsp;
         </li>



        <li class="dropdown" id="menuLogin">

                            <a class="dropdown-toggle" href="#" data-toggle="dropdown" id="navLogin">Login</a>
                            <div class="dropdown-menu" style="padding:17px;">
                                <form id="formLogin" class="form"> 
                                    <label>Login</label> 

                                    <input name="username" id="username" type="text" placeholder="Username" pattern="^[a-z,A-Z,0-9,_]{6,15}$" data-valid-min="6" title="Enter your username" required="">
                                    <input name="password" id="password" type="password" placeholder="Password" title="Enter your password" required=""><br>
                                    <button type="button" id="btnLogin" class="btn">Login</button>
                                </form>
                                <form><a href="#" title="Fast and free sign up!" id="btnNewUser" data-toggle="collapse" data-target="#formRegister">New User? Sign-up..</a></form>
                                <form id="formRegister" class="form collapse">

                                    <input name="email" id="inputEmail" type="email" placeholder="Email" required="">
                                <input name="username" id="inputUsername" type="text" placeholder="Username" pattern="^[a-z,A-Z,0-9,_]{6,15}$" data-valid-min="6" title="Choose a username" required=""><br>
                                <input name="password" id="inputpassword" type="password" placeholder="Password" required=""> 
                                <input name="verify" id="inputVerify" type="password" placeholder="Password (again)" required=""><br>                                  
                                <button type="button" id="btnRegister" class="btn">Sign Up</button>
                            </form>

                        </div>

                    </li>


    </ul>

下拉列表中出现了什么问题，我在下拉列表中尝试了左侧导航，但它没有用，谢谢。

Answer 1

修正了错误，行读数：

 <div class="dropdown-menu" style="padding:17px;">

应该添加一个下拉菜单 - 右键，所以正确的行应该是：

  <div class="dropdown-menu dropdown-menu-right" style="padding:17px;">

“下拉菜单右键”正确包装菜单！

Bootstrap下拉登录表单浮出屏幕

1 个答案: